使用vue Devtools

第一步: 在谷歌应用商店中查找 vue Devtools 并安装。安装之后,即使我们打开了vue项目发现vue标识是灰色的,说明并没有成功启动vue。

第二步: 默认安装的情况下,找到C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\3.1.2_0下的manifest.json。

使用vue Devtools

用sublime打开,然后将其中的第二行代码里的persistent选项修改为true。

 "background": {
"persistent": true,
"scripts": [ "build/background.js" ]
},

第三步: 在使用vue-cli脚手架构建的项目中,如果使用 npm run dev, 打开浏览器后就可以发现 标识 变绿,这时就可以使用了,如下所示:

使用vue Devtools

这时,我们就可以很好地管理我们的项目了。

结合使用debugger来调试代码就好了。  这样可以检测代码在运行中的状态, 尤其是对于打包后的代码,如果不用debugger,那么代码就会被打包,很乱,看不到事情的真相,而使用debugger拿到的就是本来的代码。

上一篇:怎样在Chrome浏览器上安装 Vue Devtools 扩展程序


下一篇:【Linux】CentOS 7.4 安装 MySQL 8.0.12 解压版