原 Chrome安装vue-devtools插件

版权声明：本文为博主原创文章，请尊重他人的劳动成果，转载请附上原文出处链接和本声明。
本文链接：https://www.91mszl.com/zhangwuji/article/details/1385

一：下载vue-devtools

下载地址：https://github.com/vuejs/devtools

我这里下载的是vue-devtools v5.1.1版本。

二：配置npm使用淘宝镜像，依次执行如下命令

npm config set registry http://registry.npm.taobao.org/

npm install

三：执行编译命令

npm run build

四：打开vue-devtools源码目录，在目录E:\devtools-5.1.1\shells\chrome下找到manifest.json文件，将persistent由false改成true

更改后的效果

五：在chrome浏览器地址栏中输入网址：chrome://extensions/ 打开开发者模式，然后点击加载已解压的扩展程序

然后选择chrome文件夹。

六：添加后的效果图

七：检查vue devtools 插件是否安装好

7.1）打开vs code 随便写一个html，然后点击右键，选择 Open with Live Server

7.2）然后F12打开浏览器的控制台，可以看到多了一个vue出来。