1.vue-devtools下载

官网:https://devtools.vuejs.org/guide/installation.html
大部分开发人员的首选都是Chrome浏览器,但是由于是国外服务器,因此在一些操作上都会是响应时间过长,比如我们下载vue-devtools;因此在官网上,我们选择GitHub下载Zip,就会非常快速与简单;
1.第一步:点击GitHub
在这里插入图片描述
2.第二步:点击code,选择Zip
在这里插入图片描述

2.构建vue-devtools工具插件

3.第三步:解压安装包
在这里插入图片描述
4.第四步:点击进入当前文件夹,然后进入当前目录的cmd窗口(点击目录栏->输入cmd->点击回车);在这里插入图片描述
点击回车进入命令窗口
在这里插入图片描述
5.第五步:依赖安装,命令:npm i
在这里插入图片描述
如果这部报错了,请参考文章:vue-devtools安装失败
6.第六步:构建vue-devtools工具插件;命令:npm run build;执行完成后会在shells下生成chrome文件夹。此文件夹就是用来放入chrome的扩展程序。
在这里插入图片描述

3.vue-devtools扩展配置

7.第七步:在Chrome中安装插件;
①打开浏览器,选择扩展程序;
在这里插入图片描述
②打开开发者模式,选择加载已解压的扩展程序;
在这里插入图片描述
③选择我们shells文件夹下的Chrome文件夹
在这里插入图片描述
然后就可以看到在扩展程序中有插件了;这样也就安装成功了!
在这里插入图片描述

GitHub 加速计划 / de / devtools
24.59 K
4.14 K
下载
vuejs/devtools: Vue.js 开发者工具,这是一个浏览器插件,可以安装在 Chrome 和 Firefox 等现代浏览器中,用于调试 Vue 应用程序,提供了组件树查看、状态快照、时间旅行等高级调试功能。
最近提交(Master分支:2 个月前 )
79116147 - 4 个月前
f0359002 - 4 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐