方法一:chrome直接访问下面地址下载安装:(需要翻墙)

https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

方法二:手动安装chrome扩展程序

1、获取vue-devtools项目,进入vue官网>生态系统>工具>devtools ,把vue-devtools项目clone到本地,命令行执行内容如下:

第一步:等待clone完成
git clone https://github.com/vuejs/vue-devtools.git 第二步:切换到devtools项目中,并安装依赖,可能有点慢,稍等。。。
cd .\vue-devtools\
npm install 第三部:打包
npm run build

2、添加chrome扩展程序,如下图:

完成!

当然有可能出现一点小状况,在vue项目(开发模式下)中 vue-devtools扩展程序的图标仍是灰色的(点击提示:Vue.js not detected),或者是亮的,但是点击后,开发者工具中没有vue-devtools入口的 ,  可以尝试重启服务或者重新打开开发者工具。

vue应用调试工具 vue-devtools安装的更多相关文章

  1. vue教程3-04 vue.js vue-devtools 调试工具的下载安装和使用

    vue教程3-04 vue.js vue-devtools vue调试工具的安装和使用 一.vue-devtools 下载与安装 1.需要 fan qiang 2.打开谷歌浏览器设置--->扩展 ...

  2. Vue安装以及Vue项目创建以及Vue Devtools安装

    这几天一直在学习Vue.js框架. 因为以前没有前端项目的经验,也没学过什么前端框架,所以,对于vue.js的学习有些不知所措. 在vue.js官网看教程,按照教程指点,可以不用脚手架开发,也可以搭建 ...

  3. Vue中devtools安装使用

    vue.js的devtools安装 安装 1.github下载地址:https://github.com/vuejs/vue-devtools 2.下载好后进入vue-devtools-master工 ...

  4. vue开发调试工具vue-devtools安装

    vue开发调试工具别人总结的非常好,所以直接把链接拿过来了,就当做个笔记了,也希望能帮到有需要的人,感谢“沉着前进”,来源(https://www.cnblogs.com/fighxp/p/78150 ...

  5. chrome浏览器的VUE调试插件Vue.js devtools

      chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...

  6. vue-devtools是vue浏览器调试工具

    开vue官网在vue-生态系统-工具可以看到vue-devtools这个工具: vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率.接下来我 ...

  7. 【vue.js】windows下安装vue.js

    windows下搭建vue开发环境 Vue.js是一套构建用户界面的 “渐进式框架”.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常 ...

  8. vue学习笔记 vue安装

    一.安装步骤:(用cmd命令用管理身份安装比较顺利) 1.安装node,安装后可以输入npm -v 查看版本,升级npm可用 cnpm install npm -g 2.安装vue 输入cnpm in ...

  9. vue.js 三种方式安装

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  10. Win环境下安装vue及运行vue开发的前端项目

    vue安装及配置 首先下载node.js要求版本在8.9以上        官网:https://nodejs.org/zh-cn/ 下载完可检查在windows任务命令行里输入node -v 使用淘 ...

随机推荐

  1. 新一代数据安全的制胜法宝-UBA

    [摘要]在入侵防御领域,运用数据分析的方法保护数据的技术其实没有什么新的东西,比如防火墙-分析数据包的内容以及其他的元数据,如IP地址,从增长的数据条目中检测和阻断攻击者:防病毒软件不断的扫描文件系统 ...

  2. zz:NETCONF协议详解

    随着SDN的大热,一个诞生了十年之久的协议焕发了第二春,它就是NETCONF协议.如果你在两年前去搜索NETCONF协议,基本得到的信息都是"这个协议是一个网管协议,主要目的是弥补SNMP协 ...

  3. 洛谷 题解 2165 [AHOI2009]飞行棋

    本蒟蒻又来发题解了, 看到这个题目,本蒟蒻直接开始推公式.. 嗯,可以通过弧长,推出弦长(l = 2 * r * cos(90 * l / (r * Π)); 然后对比各条弦长的平方和与直径的平方. ...

  4. webpack4.0(三)--动态生成html

    webpack4.0--动态生成html 前言: webpack-dev-server实现了自动编译刷新浏览器,让编译出来的bundle.js托关于服务器根路径(电脑内存)中去.使用--content ...

  5. Mysql双活方案

    #### 说明 Mysql主主互备即为两个mysql的互为备份机   ##### Windows下安装步骤(Linux下步骤类似,基本就是装上mysql,然后修改配置来完成主从的设置) - step1 ...

  6. Orleans的生产环境部署

    这一章非常简单 只要照着官方文档做就行了 文档地址 打好NUGET包后 Sql脚本是在项目下的OrleansAdoNetContent

  7. 【JS】303- 编写更好的 JavaScript 条件式和匹配条件的技巧

    译者:@chorer 译文:https://chorer.github.io/2019/06/24/Trs-更好的JavaScript条件式和匹配标准技巧/作者:@Milos Protic原文:htt ...

  8. docker入门-安装篇

    一.docker介绍 1:docker官网 www.docker.com 2:github  https://github.com/docker/docker.github.io 3:开源的容器引擎, ...

  9. Es6中箭头函数与普通函数的区别

    Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...

  10. Centos7使用离线安装包rpm安装MySQL5.6

    参考地址: https://blog.csdn.net/ai_64/article/details/100557530 https://dev.mysql.com/doc/refman/5.6/en/ ...