vue -- 项目调试

方式1：vue-devtools插件

vue-devtools是一款基于chrome游览器的插件，用于调试vue应用，这能够极大地提升咱们的调试效率。

使用步骤

一、 到github下载：https://github.com/vuejs/vue-devtools

二、 在vue-devtools目录下安装依赖包

cd vue-devtools
cnpm install

三、 扩展Chrome插件

Chrome浏览器 > 更多程序 > 拓展程序

四、 vue-devtools使用

vue项目, 打开f12, 选择vue就能够使用了。

使用debugger和sourcemap调试Vue组件（重点）

针对vue-cli webpack官方脚手架，打开build/webpack.dev.conf.js文件，找到下面这句：

devtool: '#cheap-module-eval-source-map',

新版本也可在config/index.js中找到，注意是在开发环境里（dev），

修改成：

devtool: '#eval-source-map',

好了，一不当心要改的配置已经改完了~

使用：

如今是具体调试了。假设咱们想调试App.vue这个组件，能够在想要调试的代码前添加debugger方法。