vue调试工具之 vue-devtools的安装
这里介绍一下vue-devtools的安装方法之一:
chrome浏览器的应用商店不能直接访问(需要跨域),所以直接应用商店安装的方法就行不通了。
1、到github主页去下载安装:
git clone https://github.com/vuejs/vue-devtools
2、继续执行以下命令(cnpm国内镜像下载更快):
cd vue-devtools //进入当前目录
cnpm install //下载依赖
npm run build //打包
3、进入chrome浏览器添加扩展程序:
chrome浏览器>> 更多工具>> 扩展程序,进入下图页面:
(1)勾选开发者模式
(2)点击加载已解压的扩展程序(选择地址为:安装路径>> vue-devtools>>shells>>chrome),将chrome文件夹导入
(3)点击确定就能安装成功

4、安装成功的页面如下:

5、此时地址栏右侧出现vue的图标,在vue项目下图标变为亮色,切能够在开发者工具中进行vue的调试:
你安装成功了吗?快使用vue-devtools进行vue项目开发吧!
vue调试工具之 vue-devtools的安装的更多相关文章
- vue调试工具vue-devtools安装及使用方法
vue调试工具vue-devtools安装及使用方法 https://www.jb51.net/article/150335.htm 本文主要介绍 vue的调试工具 vue-devtools 的安装和 ...
- vue教程3-04 vue.js vue-devtools 调试工具的下载安装和使用
vue教程3-04 vue.js vue-devtools vue调试工具的安装和使用 一.vue-devtools 下载与安装 1.需要 fan qiang 2.打开谷歌浏览器设置--->扩展 ...
- Chrome Vue Devtools插件安装和使用
安装:fq后在chrome应用商店搜索 Vue Devtools并安装,安装成功后浏览器右上角有vue的图标 安装完毕后,打开含有vue框架的网站,这是vue图标会变亮,进入开发者工具,再右侧vue选 ...
- Vue学习笔记-vue调试工具vue-devtools安装及使用
一 使用环境: windows 7 64位操作系统 二 vue调试工具vue-devtools安装及使用 1.下载: 百度中查找 "vue-devtools下载" 找到最新 ...
- VUE环境搭建、创建项目、vue调试工具
环境搭建 第一步 安装node.js 打开下载链接: https://nodejs.org/en/download/ 这里下载的是node-v6.9.2-x64.msi; 默认式的安装,默认 ...
- chrome浏览器的VUE调试插件Vue.js devtools
chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...
- Vue框架下的node.js安装教程
Vue框架下的node.js安装教程 python服务器.php ->aphche.java ->tomcat. iis -->它是一个可以运行JAVASCRIPTR 的运行环 ...
- Vue.js 2.x笔记:安装与起步(1)
1. 环境准备 Vue是一套用于构建用户界面的渐进式框架,设计为可以自底向上逐层应用.Vue 的核心库只关注视图层. 安装Node.js,下载:https://nodejs.org/ 查看安装: $ ...
- Vue学习笔记之vue-cli脚手架安装和webpack-simple模板项目生成
vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. GitHub地址是:https://github.com/vuejs/vue-cli 一. ...
- Vue学习之vue-cli脚手架下载安装及配置
Vue学习之vue-cli脚手架下载安装及配置:https://www.cnblogs.com/clschao/articles/10650862.html 1. 先下载node.js,下载地址:ht ...
随机推荐
- javascript之fill()方法
无意中看到fill这个方法,有些不解,起初以为是人家自定义的方法,后来才发觉原来不是,javascript里面是真的有这个方法,于是特地学习了下. fill()方法的作用是使用一个固定值来替换数组中的 ...
- windows平台下python 打包成exe可执行文件
第一步 安装 pyinstaller 命令行下运行:pip install pyinstaller 第二步 打包安装 pyinstaller Test.py 第三步 完成 找到打包目录下dist目录 ...
- 一键批量打印EXCEL、WORD文档
一键批量打印EXCEL.WORD文档,本方法也可以打印同一个文档N份,可以批量打印A3.A4文档,包括单.双面打印等.希望能帮到广大朋友.请大家注重原创版权,不得在未经许可的下转载.传播,或者用来对同 ...
- nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address
http://blog.csdn.net/ownfire/article/details/7966645 今天在做LNMP的时候,启动nginx服务,无法开启,导致网页打不开.把服务从起一下发现提示错 ...
- dedecms_
2012-7-5(no1)当我们点击检索结果的某个电影超链接时,如何跳转到对应的内容页[本资源由www.qinglongweb.com搜集整理] dedelist标签 --可以嵌套 项目移植: mys ...
- 为什么我不愿意用ECharts
前言 ECharts是百度一个使用 JavaScript 实现的开源可视化库,提供了创建多种多样的图标方式,包括坐标系,图例,提示,工具箱等基础组件,并在此上构建出折线图.柱状图.散点图.K线图.饼图 ...
- asm文件开头的assume意义
body, table{font-family: Consolas; font-size: 13.5pt} table{border-collapse: collapse; border: solid ...
- java里程碑之泛型--泛型注意的几点
1,泛型的基本语法:类名<具体类> 对象名 = new 类名<具体类>().类型参数规范如下: 1),K键,比如映射的键,key的类型 2),V值,比如Map的值,value类 ...
- gd库的安装
gd库简介 主要用途编辑 在网站上GD库通常用来生成缩略图,或者用来对图片加水印,或者用来生成汉字验证码,或者对网站数据生成报表等.在PHP处理图像,可使用GD库,而GD库开始时是支持GIF的,但由于 ...
- Java中的try catch finaly先后调用顺序
自我总结,有什么不足或好的方案,希望大家给予纠正,感激不尽! 目的:try catch finaly的顺序执行,和大家复习一遍. 方法:debug来确认执行顺序.(需要引入junit包) 废话不多说, ...