码迷,mamicode.com
首页 > 其他好文 > 详细

通过npm安装vue-devtools(vue的chrome调试工具)

时间:2018-07-24 19:26:11      阅读:211      评论:0      收藏:0      [点我收藏+]

标签:bubuko   扩展程序   uil   打开   OLE   shel   inf   程序   ext   

1. 下载chrome的扩展程序包

  github地址:https://github.com/vuejs/vue-devtools

2. 下载完成后,解压到先关文件夹下。进入vue-devtools文件夹,开始安装项目所需依赖包

  命令:npm install (如果有国内镜像环境,直接cnpm install就好了)

  下载成功出现如下状态:

  技术分享图片

 

3. 开始编译项目文件:

  命令: npm run build

  技术分享图片

4. 在vue-devtools文件夹下:shells>chrome>manifest.json,将配置里的persistent的值修改为true;

技术分享图片

5. 打开chrome,进入扩展程序管理界面(chrome://extensions/),加载已解压的扩展程序。选择vue-devtools>shells>chrome。加载完成就会出现以下的Vue.js devtools扩展程序。然后重启浏览器,再打开vue项目页面就可以在chrome的Devtools(就是console的那一栏,一般都排在最后面的。)找到Vue面板了。

技术分享图片

 

 

通过npm安装vue-devtools(vue的chrome调试工具)

标签:bubuko   扩展程序   uil   打开   OLE   shel   inf   程序   ext   

原文地址:https://www.cnblogs.com/matthewkuo24/p/9361797.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!