admin 管理员组

文章数量: 1184232

一、vue-devtools安装 (chrome)（正确亲测有效）
1.下载vue-devtools

（1）cmd下node指令：G:\Node>cnpm install -g vue-devtools

（或者npm指令，下载到node_modules文件夹里或者你自己定义的全局目录里）

（2）网盘资源链接：https://pan.baidu/s/1mevtgG2JbJN0YXesumI58Q 提取码 rejl

目录结构：

2.进入vue-devtools文件夹，Shift+鼠标右键-》打开命令行，npm install 回车
3.将vue-devtools->vender->manifest.json里面的"persistent":true ( false改成true)
4.将vender文件夹剪切到node_modules里面去

5.浏览器中设置扩展

chrome设置->扩展程序->加载已解压的扩展程序->选中下载路径的vender包（node_modules\vue-devtools\vender），打开chrome右上角会有个发绿的“V”的vue标志（发灰的话是vue.js not detected，没有检测到vue，找个有vue的页面打开即可）。

6.给予vue项目相应权限

（比如运行bilibili等的站点点击vue扩展显示Vue.js is detected on this page. Devtools inspection is not available because it’s in production mode or explicitly disabled by the author.就是说vue项目没有赋予扩展权限）

my-vue\src\main.js文件中添加：

import Vue from ‘vue’

Vue.config.devtools=true

这样自己的vue项目就可以在浏览器开发工具的扩展程序里调试了。

本文标签： 插件 浏览器 谷歌 chrome Vue

版权声明：本文标题：谷歌Chrome浏览器安装vue调试插件 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/b/1763526219a3246814.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。