通过实例解析chrome如何在mac环境中安装vue-devtools插件


Posted in Javascript onJuly 10, 2020

1之前在windows上装过,最近刚换了个mac本,重新安装下,也是为了记录下我安装的过程。

github下载vue-devtool到本地

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

注意,下载的时候默认的是在dev分支,要切换到master,然后克隆到本地(可以先放桌面)

通过实例解析chrome如何在mac环境中安装vue-devtools插件

2.将下载的项目文件放入 Chrome浏览器的插件文件夹

在浏览器地址栏输入chrome://version/

通过实例解析chrome如何在mac环境中安装vue-devtools插件

找到路径之后,可以在顶部工具栏”前往“中直接输入文件地址

3.在default文件夹下新建Extensions文件夹(已经存在就不用新建了),并且将下载的vue-devtool-master文件夹复制进去,cd进入该文件夹cd vue-devtools-master

4. 安装依赖

npm install

npm run build(没有这一步会报错哦~)

通过实例解析chrome如何在mac环境中安装vue-devtools插件

5.在地址栏输入chrome://extensions,打开右侧开发者模式

将vue-devtools-master/shells/chrome文件夹拖入扩展程序页面即可

如果以上步骤完成之后,在控制台还是不显示Vue的tab,以上vue图标不亮,点击图标出现vue.js not detected的提示还需要进行以下步骤

找到安装目录

通过实例解析chrome如何在mac环境中安装vue-devtools插件

修改mainifest.json文件中的persistent:false,修改成persistent:true。一般这个时候就可以正常使用了

如果还是不行,修改webpack.config.js的代码

通过实例解析chrome如何在mac环境中安装vue-devtools插件

修改成development,(可能正式版本发布的时候,需要修改回来,待验证)

再运行vue项目 就可以正常调试了

通过实例解析chrome如何在mac环境中安装vue-devtools插件

通过实例解析chrome如何在mac环境中安装vue-devtools插件

通过实例解析chrome如何在mac环境中安装vue-devtools插件

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在IE上直接编辑网页内容的js代码(IE地址栏js)
Apr 27 Javascript
javascript中创建对象的三种常用方法
Dec 30 Javascript
Google的跟踪代码 动态加载js代码方法应用
Nov 12 Javascript
Jquery validation remote 验证的缓存问题解决方法
Mar 25 Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
Aug 18 Javascript
JS实现黑色大气的二级导航菜单效果
Sep 18 Javascript
用NODE.JS中的流编写工具是要注意的事项
Mar 01 Javascript
jQuery对象的链式操作用法分析
May 10 Javascript
深入理解JS继承和原型链的问题
Dec 17 Javascript
使用jQuery实现鼠标点击左右按钮滑动切换
Aug 04 jQuery
JavaScript实现表单注册、表单验证、运算符功能
Oct 15 Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 Javascript
基于vue+element实现全局loading过程详解
Jul 10 #Javascript
JS sort方法基于数组对象属性值排序
Jul 10 #Javascript
JavaScript this指向相关原理及实例解析
Jul 10 #Javascript
JavaScript indexOf()原理及使用方法详解
Jul 09 #Javascript
如何在postman测试用例中实现断言过程解析
Jul 09 #Javascript
解决qrcode.js生成二维码时必须定义一个空div的问题
Jul 09 #Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
Jul 09 #Javascript
You might like
PHP日期时间函数的高级应用技巧
2009/05/16 PHP
PHP连接MongoDB示例代码
2012/09/06 PHP
php判断对象是派生自哪个类的方法
2015/06/20 PHP
php给图片加文字水印
2015/07/31 PHP
PHP微信支付结果通知与回调策略分析
2019/01/10 PHP
AJAX架构之Dojo篇
2007/04/10 Javascript
jquery ready函数源代码研究
2009/12/06 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
2011/04/16 Javascript
JS写的贪吃蛇游戏(个人练习)
2013/07/08 Javascript
一个JavaScript操作元素定位元素的实例
2014/10/29 Javascript
jQuery中siblings()方法用法实例
2015/01/08 Javascript
jQuery中andSelf()方法用法实例
2015/01/08 Javascript
js实现跨域访问的三种方法
2015/12/09 Javascript
JS动态加载脚本并执行回调操作
2016/08/24 Javascript
Bootstrap使用基础教程详解
2016/09/05 Javascript
Ionic+AngularJS实现登录和注册带验证功能
2017/02/09 Javascript
PHP7新特性简述
2017/06/11 Javascript
Vue写一个简单的倒计时按钮功能
2018/04/20 Javascript
vue中轮训器的使用
2019/01/27 Javascript
js动态添加带圆圈序号列表的实例代码
2021/02/18 Javascript
[06:40]2014DOTA2西雅图国际邀请赛 DK战队巡礼
2014/07/07 DOTA
python anaconda 安装 环境变量 升级 以及特殊库安装的方法
2017/06/21 Python
django 发送邮件和缓存的实现代码
2018/07/18 Python
python实现可变变量名方法详解
2019/07/01 Python
基于python实现自动化办公学习笔记(CSV、word、Excel、PPT)
2019/08/06 Python
Python魔法方法 容器部方法详解
2020/01/02 Python
基于Python和PyYAML读取yaml配置文件数据
2020/01/13 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
python 列表推导和生成器表达式的使用
2021/02/01 Python
10分钟入门CSS3 Animation
2018/12/25 HTML / CSS
淘宝活动策划方案
2014/02/06 职场文书
2015年元旦活动总结
2014/05/09 职场文书
可怜妈妈观后感
2015/06/09 职场文书
2015年物业管理员工工作总结
2015/10/15 职场文书
虚拟机linux端mysql数据库无法远程访问的解决办法
2021/05/26 MySQL
青岛市的收音机研制与生产
2022/04/07 无线电