安装:
1. 下载dev-tools dev-tools,gitHub地址:github.com/vuejs/devto…
// 由于我使用github上的git下载地址clone失败了
// 下面贴出我成功clone的地址
git clone https://github.com/vuejs/vue-devtools
复制代码
2. 在vue-devtools目录下安装依赖包
// 在项目文件下打开cmd命令行窗口
npm install
// 或者使用yarn
复制代码
3. 修改manifest.json文件
把"persistent":false改成true
4. 重新打包 注意:由于当时执行
npm run build
命令时,报错了,最后用的是yarn run build
才打包成功 没有安装yarn的小伙伴请跳转到第五点
npm run build
// 失败的话建议安装yarn包,执行如下命令
yarn run build
复制代码
扩展chrome插件
在谷歌浏览器里点击右上角的三点按钮 > 更多工具 > 扩展程序。或者在输入框中输入地址:
chrome://extensions/
- 打开页面后 打开右上角的开发者模式 > 左上角的加载已解压的扩展程序 > 选择刚刚打包好的
packages/shell-chrome
文件即可
- 安装完成,重新启动浏览器,建议将vue-tools点击刷新
以上就是vue的devtools的全部内容,下面则是题外的如何安装使用yarn包,不需要的小伙伴可以忽略
5. 安装yarn
更多yarn介绍在这篇文章juejin.cn/post/699248…
- 下载node.js,使用npm安装
npm install -g yarn
查看版本:yarn --version
- Yarn 淘宝源安装,分别复制粘贴以下代码行到黑窗口运行即可
yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
复制代码