在浏览器上安装 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 ...
随机推荐
- Linux之特殊符号与正则表达式
Linux中常用的特殊符号 '' 所见即所得,吃啥吐啥 "" 特殊符号会被解析运行 `` ==== $() 先运行里面的命令 把结果留下 > 重定向符号 先清空文件的内容 然 ...
- centos7下安装docker(15.1跨主机网络)
之前学习了单个host上的网络,我们知道单个host上的网络有:none,host,bridge和joined,他们解决了单个host上面的容器通信的问题:接下来我们讨论跨主机间容器通信的方案 跨主机 ...
- CSAPP:第三章程序的机器级表示3
程序的机器级表示3 关键点:过程.调试.指针 过程1.运行时栈2.转移控制3.数据传递4.栈上的局部存储5.寄存器中的局部存储空间理解指针使用GDB调试器 过程 1.运行时栈 x86-64的栈向低 ...
- tomcat 安装配置部署到nginx+tomcat+https
目录 1 Tomcat简介 2.下载并安装Tomcat服务 2.2 部署java环境 2.3 安装Tomcat 2.4 Tomcat目录介绍 (关注点 bin conf logs webapps) 2 ...
- RabbitMQ详解(一)------简介与安装
RabbitMQ 这个消息中间件,其实公司最近的项目中有用到,但是一直没有系统的整理,最近看完了<RabbitMQ实战 高效部署分布式消息队列>这本书,所以顺便写写. 那么关于 Rabb ...
- 完成了Coursera的一个机器学习课程
终于完成了这个课程,从开始学习,到现在差不多过了一年的时间,中间由于一些原因耽搁了,最终还是完成了,记录一下!
- Spring Cloud Config 分布式配置中心【Finchley 版】
一. 介绍 1,为什么需要配置中心? 当服务部署的越来越多,规模越来越大,对应的机器数量也越来越庞大,靠人工来管理和维护服务的配置信息,变得困难,容易出错. 因此,需要一个能够动态注册和获取服务信息的 ...
- ASP.NET Core 添加区域步骤(详细)
1 前言 早就想总结一下,但是没时间,这次有时间了,就详细的把步骤写出来. 2 步骤 2.1 添加区域 右键项目->添加->区域,如图1: 区域名称:Ceshi 添加完之后解决方案管理器会 ...
- .Net Core 在 Linux-Centos上的部署实战教程(四) ---- 总结
问题: 1.网站部署上访问不了,可能是防火墙/安全组的原因 2.在后台运行这块上 我查了一些类似的部署博客 好多人都是用守护进程搞的,本人也算Linux小白 不懂这样做的好处是啥 有大佬的话 可 ...
- Django Restframework 过滤器
一.基本配置: 1.安装:pip install django-filter 2.将 django_filters 配置到INSTALLED-APPS中 3.对 REST_FRAMEWORK 配置: ...