Vue-devtools的安装与使用
Vue-devtools的安装与使用
这里我是先看了这篇文章的:https://www.cnblogs.com/teamemory/p/12399191.html
步骤:
1、下载mater 分支 的vue-devtools(我使用的是4.1.5版本),我当时直接在vue官网进入devtools下载后npm run build会报错(所以切记要下载mater分支下的vue-devtools)
下载地址:
mater分支下载地址:https://github.com/vuejs/vue-devtools/tree/master
2、将下载好的安装包解压到一个目录中,使用命令行cd到刚刚解压好的vue-devtools-mater下,执行npm install或者是cnpm install(cnpm需要自己先下载)
3、执行npm run build,如下图:
4、打开谷歌浏览器,输入 chrome://extensions/ 网址,进入到扩展程序界面,点开右上角的”开发者模式“,点击”加载已解压的扩展程序“,选择文件夹路径为:\vue-devtools-master\shells\chrome点击确认。如下图代表添加成功。
5、重新启动vue项目,重新打开F12调试工具,就可以看到vue选项。如果还不能看到vue选项,就重新启动下浏览器即可。
注意事项:一定要去下载mater 分支下 的vue-devtools,dev的目前测试npm run build 会失败。
备注:这是我第一次写博客,如有哪里做的不好的地方请多指教。