Vuex 调试工具安装

vue-devtools是一款基于chrome浏览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率。

chrome商店直接安装

最简单的方法是直接在chrome商店下载安装vue-devtools,但是这需要翻墙才能下载。

手动安装

  • 首先到github找到vue-devtools。然后将其clone到本地,这需要先在本机安装gitnode环境。
git clone https://github.com/vuejs/vue-devtools.git
  • 在根目录,安装项目所需要的npm包:
npm install

如果觉得太慢,可以安装一个cnpm(淘宝镜像),然后使用cnpm install命令来安装依赖包,这样速度会快很多。

  • 使用命令编译项目文件:
npm run build
  • 修改vue-devtools-master文件夹中shells文件夹下的manifest.json文件,将persistent项修改为true:
"persistent":true
  • 扩展Chrome插件。

点击浏览器中的“更多工具”–>扩展程序。不同版本浏览器拓展程序选项位置可能不一致。

或者直接在浏览器中输出“chrome://extensions/”进入扩展程序页面,然后在页面中找到“加载已解压的扩展程序”按钮,如果没看到这个按钮,可以勾选页面右上角的“开发者模式”就可以看到了。

然后选择vue-devtools-master>shells下的chrome文件夹就可以了,安装成功后如下图所示:

安装后,需要关闭浏览器再重新打开, 才能使用。

使用

在Vue项目中,按F12,选择vue就可以使用了。如下图所示:

链接:https://www.9xkd.com/

展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 技术黑板 设计师: CSDN官方博客
应支付0元
点击重新获取
扫码支付

支付成功即可阅读