vue chrome调试时 代码行号跟源码行号对不上,存在偏移

1.使用vue-cli创建webpack模板项目:

vue init webpack my-proj

2.安装并顺利运行

npm install
npm run dev

3.在chrome浏览器console 进入调试工具source标签下,查看源码:

vue chrome调试时 代码行号跟源码行号对不上,存在偏移

通过点击这个上面 InStockAllotManage.vue?e930:706 进入谷歌source中,

vue chrome调试时 代码行号跟源码行号对不上,存在偏移
source中 ,文件中的代码是这样的,其中是被进行特殊编译的代码

Chrome版本55、56均存在此问题,应该并非浏览器原因导致。找了半天,网上基本上没啥资料

解决方案webpack 配置:

//原有配置
    // https://webpack.js.org/configuration/devtool/#development
    devtool: 'cheap-source-map',
    
   
//修改后配置
  // https://webpack.js.org/configuration/devtool/#development
    devtool: 'source-map',

相关推荐