vue使用source map调试

作者：System 时间：2024年08月15日分类：所有,vue.js 字数：618

在Vue项目中使用source map进行调试，首先确保你的开发环境配置了source map。在vue.config.js文件中，你可以设置productionSourceMap属性为true来在生产环境下生成source map。




// vue.config.js
module.exports = {
  // ...
  productionSourceMap: process.env.NODE_ENV !== 'production',
  // ...
};

如果你使用的是Vue CLI 3+创建的项目，默认情况下开发环境下会生成source map。如果你需要在生产环境下也生成source map，可以像上面代码一样设置。

此外，确保你的浏览器开启了source map支持。在Chrome浏览器中，你可以通过开发者工具的设置来开启source map：

在开启了source map支持的情况下，当代码运行到断点时，开发者工具会显示源代码而不是转换后的代码，这有助于你更容易地调试。