在浏览器上安装 Vue Devtools工具
Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的开发者浏览器扩展,可以在浏览器开发者工具下调试代码。
1)首先在github下载devtools源码,地址:https://github.com/vuejs/vue-devtools。
2)下载好后进入vue-devtools-master工程 执行cnpm install, 下载依赖,然后执行npm run build,编译源程序。
例子:d:\Program Files\vue-devtools-master>npm run build
3)编译完成后,目录结构如下:
修改shells、chrome目录下的mainifest.json 中的persistant为true:
4)打开谷歌浏览器的更多工具--->扩展程序,并勾选开发者模式
然后将刚刚编译后的工程中的shells目录下,chrome的整个文件夹直接拖拽到当前浏览器中,并选择启用,即可将插件安装到浏览器。
5)打开一个已有的vue项目,运行项目,然后在浏览器中--->设置--->更多工具--->开发者工具,进入调试模式:
发现vue.js is not detected ,可以调整一下webpack.config.js的代码,

最后,重启一下你的vue项目应该就可以使用了。
在浏览器上安装 Vue Devtools工具的更多相关文章
- 在google chrome浏览器上安装 Vue Devtools工具
[转]https://www.cnblogs.com/tanyongli/p/7554045.html Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的 ...
- 怎样在Chrome浏览器上安装 Vue Devtools 扩展程序
第一步: 前往 GitHub 下载 Vue Devtools 项目文件 https://github.com/vuejs/vue-devtools 注意: 1. 将分支切换为 master 2. 下载 ...
- 浏览器上安装vue devtools
安装前要检查一下node版本的(node -v),必须将版本提高到>4.4.7.低版本的node在安装devtools时执行npm install 时报错.如何升级node版本,若在window ...
- Vue安装Vue Devtools调试工具提示 Error: Cannot find module '@vue-devtools/build-tools' 解决办法
我看网络上面安装Vue Devtools 调试工具的步骤几乎都是按照文章链接里的步骤进行安装, 但是在最终执行编译命令的时候 :npm run build ,提示如下错误: 尝试了很多方法,都不能解决 ...
- 在Ubuntu|CentOS上安装Shutter截图工具及快捷键设置
简介 Shutter前身叫GScrot,它是一款相当棒的截图软件. 通过Shutter,你可以截取包括选定区域.全屏幕.窗口.窗口内的控件甚至网页的图像.通过内置的强大插件机制,你可以在截图后,对图像 ...
- 在centos 6.5 在virtual box 上 安装增强版工具
centos 6.5 在virtual box 上 安装增强版工具: 出现:centos unable to find the source of your current linux kernel ...
- 【vue】chrome已安装Vue Devtools在控制台却无显示
chrome已安装Vue Devtools在控制台却无显示的解决: 在点亮Vue Devtools图标后,控制台没有vue解读显示. 原因:脚手架配置NODE_ENV直接定义为了production版 ...
- 在Linux上安装Elasticsearch Head工具.md
在Linux上安装Elasticsearch Head工具 1.修改elasticsearch的参数 编辑elasticsearch的配置文件elasticsearch.yml $ vim /data ...
- 在CentOS 6.4上安装Puppet配置管理工具
在CentOS 6.4上安装Puppet配置管理工具 linux, puppetAdd comments 五052013 上篇说了下在ubuntu12.04上安装puppet,安装的版本为puppet ...
随机推荐
- 阿里云windows server 2012 TIME_WAIT CLOSE_WAIT
新申请的阿里云windows server 2012 R2上部署安装了socket服务器,但客户端连接后老是断开(心跳包没有),服务假死(服务不断也走),客户端申请连接会也会死在cmd下输入指令 ne ...
- RESTful学习笔记
作为一名只有几个月IT自学经历的人,在接受新知识的时候总是想找到浅显易懂的方式去理解,但往往却很难找到相关的文章,大部分都是针对具有一定经验的开发人员,因此在看了很多相关的文章才对RESTful架构有 ...
- springboot RestTemplate请求
每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code 1.定义 RestTemplateConfig 配置类 @Configuratio ...
- Python实现机器人聊天
今天午休的时候,无意之中看了一篇博客,名字叫Python实现机器人,感觉挺有的意思的.于是用其写了一个简单的Python聊天,源码如下所示: # -*- coding: utf- -*- import ...
- arm汇编之 bne与beq
在网上看了一些bne和beq的区别,但是对于初学者来说,容易越看越糊涂,因此简单介绍下: 我们先分析CPSR寄存器的Z标识位: cmp指令可以直接影响CPSR寄存器的Z标识位(条件位),从图中可以看出 ...
- dubbo源码阅读
http://seekheap.com/posts/dubbo/dubbo-src-01-overview-and-debug-environment.html 先占坑
- AWS re:Invent(2019.01.09)
时间:2019.01.09地点:北京国际饭店
- java单例模式总结
目录 一. 饿汉模式(静态初始化) 二.双重检查锁(dcl) 三. 延迟占位类 四.枚举实现 最后 常见安全的单例实现代码和自己的一点理解. 一. 饿汉模式(静态初始化) class Singleto ...
- Python—闭包
闭包的定义:即函数定义和函数表达式位于另一个函数的函数体内(嵌套函数).而且,这些内部函数可以访问它们所在的外部函数中声明的所有局部变量.参数.当其中一个这样的内部函数在包含它们的外部函数之外被调用时 ...
- Python学习第十一篇——for 的本质及如何正确修改列表
假如现在有一个列表:magicians_list = ['mole','jack','lucy'],现在想通过一个函数来实现,在列表的每个元素前面加上“the Great”的字样.现在通过一个函数来实 ...