欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue调试工具--- vue-devtools

程序员文章站 2022-06-03 23:14:53
...
Vue调试工具--- vue-devtools

vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率。接下来我们就介绍一下vue-devtools的安装。

1. 找到 vue-devtools的github项目,将其clone到本地

git clone -b v5.1.1 https://github.com/vuejs/vue-devtools.git

2. 安装项目所需要的npm包

npm install

3. 编译项目文件

npm run build

4. 添加到chrome浏览器

点击加载已解压的扩展程序,找到路径,添加进来

Vue调试工具--- vue-devtools

报错:
npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] build: `cd packages/shell-chrome &&  webpack --progress --hide-modules` npm ERR! Exit status 1 npm ERR!  npm ERR! Failed at the [email protected] build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm WARN Local package.json exists, but node_modules missing, did you mean to install?

之前通过下面的指令下载的发生如上错误

git clone https://github.com/vuejs/vue-devtools.git

此原因是因为我们git clone时默认分支为最新的develop分支。develop是测试分支,不是正式分支,git时更换分支即可。