vue devTools 安装调试

很多小伙伴们，在开发vue 项目的时候，如果想断点调试，会发现在浏览器的source 中，只能看到vue项目打包后的js或者css项目。无法看到 vue 源文件，也就是 .vue 文件。

实际上只需要做到两步，就行了。
第一步 : 在 chrome 浏览器中，安装 devtools 插件。
第二步 : 在 vue 项目中的配置文件中，配置 允许调试。

先说第二步，具体配置是 :

configureWebpack: {
    devtool: 'source-map'
}

第一步，安装 devtools 插件。这里最简单的方法，就是去谷歌的商店中，去下载，安装。但是，由于很多限制，很多小伙伴们无法翻墙。无法下载。下面推荐第二种方式。

1.先把 github 上的 devtool源码 克隆到本地

git clone https://github.com/vuejs/vue-devtools.git

第二步：安装项目所需要的npm包

npm install 

第三步：编译项目文件

npm run build

第四步：添加至chrome游览器

如果下载的是 .crx ,需要先解压一下。变成文件夹了，才能添加到 浏览器的扩展程序。
需要注意的是必须要将开发者模式打开，否则，无法添加。