Vue3.0 Devtools6.5.0 开发者工具下载和安装

1、官网地址下载:

GitHub - vuejs/devtools: ⚙️ Browser devtools extension for debugging Vue.js applications.

2、下载安装

①找到其main下的Tags选择v6.5.0版本
②点击Code
③点击Download ZIP下载
④解压压缩包到其文件夹
⑤在其devtools-6.5.0文件夹路径输入cmd回车到命令提示符
⑥执行命令npm install yarn -g
⑦输入yarn -v查看是不是命令行,如果显示不是命令行就需要配置环境变量;
Ⅰ、找到我的电脑-->右击属性-->高级系统设置-->环境变量-->系统变量-->找到系统变量里面的path-->双击path-->把复制的路径粘贴到里面点确定就行了
Ⅱ、找到你安装node.js的文件夹,在里面找到node_modules文件夹-->继续在里面文件夹里寻找到带有yarn.cmd文件的文件夹-->复制其文件夹的路径-->到系统变量里面配置
⑧重新启动cmd命令,输入yarn -v查看是否成功了,出现版本号就是成功了
⑨输入yarn install回车,等待安装完毕
⑩依赖安装完成后,开始打包build。 需要注意,这里的命令需要带watch,如果不带,会出错: yarn run build:watch
代码执行一阵后,没有其他反应,也没有结束,可以直接按Ctrl+C退出即可,再运行yarn run dev:chrome等待其执行,执行到最后显示No issues found就可以关闭了。此时去你下载解压的devtools-6.5.0的包下的packages文件夹下,再到shell-chrome下,可以看到一个build的文件夹

最后打开chrome浏览器-->扩展程序-->点击加载已解压的扩展程序-->找到刚才的shell-chrome文件夹,选择这个文件夹-->扩展栏固定vue-devtools程序就行了