Vue.js devtool插件安装后无法使用的解决办法


Posted in Javascript onNovember 27, 2017

初次使用Vue.js devtool插件的新人在安装了Vue.js devtool插件后,都会经常有一个疑问。我在chrome浏览器里面已经成功安装好Vue.js devtool插件,怎么点击后提示vue.js not detected,无法正常使用呢?对于这样的问题,新人可能会花费很多时间去找答案,今天我们就来整理了解决方法,希望对大家有帮助。

Vue.js devtool插件安装后无法使用的解决办法

首先,我们先要确保Vue.js devtool插件已经安装成功了。具体的Vue.js devtool插件的安装方法可以:chrome插件CRX的离线安装方法中找到答案。

Vue.js devtool插件安装后无法使用的解决办法

其次,我们需要找到Vue.js devtool插件的安装目录。可以在本站文章chrome插件CRX文件的安装目录中找到插件的安装位置。话说来,我们真找不到插件的安装位置,可以在本地电脑搜索插件的ID:nhdogjmejiglipccpnnnanhbledajbpd。用户可以在插件列表中找到插件的ID,如下图所示。这是我在win8系统上chrome插件的安装位置
C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\3.1.2_0

Vue.js devtool插件安装后无法使用的解决办法

第三,在找到了Vue.js devtool插件的安装目录后,打开mainifest.json文件(这是关键)。

Vue.js devtool插件安装后无法使用的解决办法

将mainfest.json中代码persistent:false,修改成persistent:true。如下图所示:

Vue.js devtool插件安装后无法使用的解决办法

一般情况下,修改完如上的位置的代码。打开vue项目后,在控制台选择vue,就应该可以正常使用了。

Vue.js devtool插件安装后无法使用的解决办法

第四,如果通过上面的方法调整过后,还是不能够使用,那么可以调整一下webpack.config.js的代码,如下图所示:

Vue.js devtool插件安装后无法使用的解决办法

最后,重启一下你的vue项目应该就可以使用了。

Vue.js devtool插件安装后无法使用的解决办法

注意:文章为本人原创,首发于下面地址。

Javascript 相关文章推荐
MooTools 1.2介绍
Sep 14 Javascript
基于jQuery的的一个隔行变色,鼠标移动变色的小插件
Jul 06 Javascript
DIY jquery plugin - tabs标签切换实现代码
Dec 11 Javascript
通过onmouseover选项卡实现img图片的变化
Feb 12 Javascript
初识SmartJS - AOP三剑客
Jun 08 Javascript
js与jquery实时监听输入框值的oninput与onpropertychange方法
Feb 05 Javascript
JavaScript中的setUTCDate()方法使用详解
Jun 11 Javascript
JS实现title标题栏文字不间断滚动显示效果
Sep 07 Javascript
微信小程序 购物车简单实例
Oct 24 Javascript
JavaScript中重名的函数与对象示例详析
Sep 28 Javascript
vue2.0 自定义组件的方法(vue组件的封装)
Jun 05 Javascript
谈谈为什么你的 JavaScript 代码如此冗长
Jan 30 Javascript
微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法
Nov 27 #Javascript
vue2实现可复用的轮播图carousel组件详解
Nov 27 #Javascript
让bootstrap的carousel支持滑动滚屏的实现代码
Nov 27 #Javascript
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
Nov 27 #Javascript
vue2.0使用swiper组件实现轮播效果
Nov 27 #Javascript
解读vue生成的文件目录结构及说明
Nov 27 #Javascript
使用Bootstrap + Vue.js实现表格的动态展示、新增和删除功能
Nov 27 #Javascript
You might like
PHP 和 MySQL 基础教程(四)
2006/10/09 PHP
php增删改查示例自己写的demo
2013/09/04 PHP
php实现计数器方法小结
2015/01/05 PHP
学习php设计模式 php实现门面模式(Facade)
2015/12/07 PHP
thinkphp跨库操作的简单代码实例
2016/09/22 PHP
php伪静态验证码不显示的解决方案
2019/09/26 PHP
PHP+fiddler抓包采集微信文章阅读数点赞数的思路详解
2019/12/20 PHP
js滚动条多种样式,推荐
2007/02/05 Javascript
JQuery 遮罩层实现(mask)实现代码
2010/01/09 Javascript
输入密码检测大写是否锁定js实现代码
2012/12/03 Javascript
JS中绑定事件顺序(事件冒泡与事件捕获区别)
2017/01/24 Javascript
前端构建工具之gulp的配置与搭建详解
2017/06/12 Javascript
Vue项目中跨域问题解决方案
2018/06/05 Javascript
详解如何在vue项目中使用eslint+prettier格式化代码
2018/11/10 Javascript
教你完全理解ReentrantLock重入锁
2019/06/03 Javascript
javascript实现点击星星小游戏
2019/12/24 Javascript
windows如何把已安装的nodejs高版本降级为低版本(图文教程)
2020/12/14 NodeJs
Python中lambda的用法及其与def的区别解析
2014/07/28 Python
python中实现php的var_dump函数功能
2015/01/21 Python
Python中time模块与datetime模块在使用中的不同之处
2015/11/24 Python
解决vscode python print 输出窗口中文乱码的问题
2018/12/03 Python
Python3 导入上级目录中的模块实例
2019/02/16 Python
关于Python形参打包与解包小技巧分享
2019/08/24 Python
matplotlib subplot绘制多个子图的方法示例
2020/07/28 Python
HTML高亮关键字的实现代码
2018/10/22 HTML / CSS
美国二手复古奢侈品包包购物网站:LXRandCo
2019/06/18 全球购物
给酒店员工的表扬信
2014/01/11 职场文书
大专毕业自我鉴定
2014/02/04 职场文书
2014年服务行业工作总结
2014/11/18 职场文书
高考学习决心书
2015/02/04 职场文书
休学证明范本
2015/06/19 职场文书
2016学雷锋优秀志愿者事迹材料
2016/02/25 职场文书
2016最新离婚协议书范本及程序
2016/03/18 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
Jsonp劫持学习
2021/04/01 PHP
Fluentd搭建日志收集服务
2022/09/23 Servers