Chrome开发者工具如何才能看到Vue项目的源码

大家好，我是 程序员码递夫。

今天给大家分享的是 Chrome开发者工具如何才能看到Vue项目的源码。

问题

我们在编写一下Vue项目时，常常要通过 chrome 进行本地调试后，才打包 生产版本。 但有时打开 chrome 的开发者工具后，看到的却是 webpack 编译后的代码，看不到 项目网页的源码，非常不便于调试。
如：

解决方法

出现这种现象，就是 vue项目为了提供启动速度，没有输出 sourceMap 的缘故，我们在vue 项目加入一下配置，就可以了。

在vue.config.js （没有的话自己手工创建）中，添加以下配置内容：

module.exports = {
   

    configureWebpack: {