vue项目编译运行后，在浏览器source文件都是压缩过的，不能在浏览器上打断点。
需要自己配置让浏览器source显示全部代码。
配置方法
1、 项目全局搜索 configureWebpack:
2、 找到vue.cong.js 给 configureWebpack 下的 devtool 设置为 'source-map'
3、 重启项目
image.png
附上代码：
module.exports = {
// 放置静态资源的地方 (js/css/img/font/...)
assetsDir: 'static',
// 是否为生产环境构建生成 source map？
productionSourceMap: false,
configureWebpack: {
devtool: 'source-map', // 配置本地调试
module: {}
},
// 配置less
// chainWebpack: config => {
// const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
// types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))
// },
// 配置 webpack-dev-server 行为。
devServer: {
open: true
}
}
打断点的位置：
image.png
文件是webpack中的.vue文件！！！
