如果是vue写的项目,谷歌浏览器右上角的vue小图标会亮起!下面介绍如何安装

1、谷歌浏览器插件商店可以点击安装【需要梯子】

2、vue官网有对应的安装包,需要自己手动 npm run build 一下 更改一个参数!

下面介绍如何 使用第二种方法:

  1、在github下载devtools源码,地址:https://github.com/vuejs/vue-devtools。

  2、本地编辑器打开,本人使用 vscode

  3、下载出来的devtool源码不带 node_modules  自己手动 npm install 下载即可

  4、你会发现 左边 多出了 node_modules

  5、运行 npm run build 如下图

  

  6、修改shells > chrome目录下的mainifest.json 中的persistent为true;

  7、打开谷歌浏览器,地址输入 chrome://extensions/  到拓展程序安装页面

  8、把chorme整个目录拖入到浏览器中,看GIF图:

  

 

谷歌浏览器 安装 Vue.js devtools 工具的更多相关文章

  1. 谷歌浏览器安装Vue.js devtools

    第一步:访问谷歌商店 在之前的博客中已经谈到了这一点的实现方式 https://www.cnblogs.com/10134dz/p/13552777.html 第二步:下载Vue.js devtool ...

  2. 安装Vue.js devtools

    1.下载安装 https://github.com/vuejs/vue-devtools#vue-devtools 通过以上地址下载安装包,解压以后进入文件,按住shift,点击鼠标右键打开命令窗口 ...

  3. 解决游览器安装Vue.js devtools插件无效的问题

    一: 打开自己写的一个vue.js网页,发现这个图标并没有亮起来,还是灰色 解决方案:  1.我们先看看Vue.js devtools是否生效,打开Bilibili(https://www.bilib ...

  4. chrome调试vue.js的插件:vue.js devtools

    1.什么是vue.js devtools? vue.js devtools是chrome的一款插件,用来调试vue的一款神器. 2.为什么下载vue.js devtools? 由于vue是数据驱动的, ...

  5. 【原】无脑操作:Chrome浏览器安装Vue.js devtool

    学习Vue.js时,Chrome浏览器安装Vue.js devtool能很方便的查看Vue对象.组件.事件等. 本文以Chrome浏览器插件Vue.js devtools_3.1.2_0.crx的安装 ...

  6. Vue调试神器之Vue.js devTools

    Vue项目中使用Vue.js devTools这款调试神器,可以极大程度的提高我们的开发效率. 安装 1.打开Chrome网上应用商店安装插件(自墙),直接搜索devTools安装即可.贵宾传送阵,请 ...

  7. 如何在Window下安装node\npm\cnpm,并安装vue.js,创建项目

    1.安装node.js node.js的官方地址为:https://nodejs.org/en/download/. 根据windows版本后,选择要下载的安装包,下载完毕,按照windows一般应用 ...

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

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

  9. 【转】安装Vue.js的方法

    安装vue.js的方法   一.简介 Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量 ...

随机推荐

  1. Failed to connect to github.com port 443: Timed out

    Git Clone下载仓库代码的时候,出现以下情况 Failed to connect to github.com port 443: Timed out 解决办法: 输入 git config -- ...

  2. 003-CHROME开发者工具的小技巧

    首先调试先进入到调试模式,快键键F12 1.代码格式化 有很多css/js的代码都会被 minify 掉,你可以点击代码窗口左下角的那个 { }  标签,chrome会帮你给格式化掉. 2.强制DOM ...

  3. border-radius 如何计算

    1.使用px: 圆的半径是那个px值大小 用这个圆放到div的角上去切割div 2.使用%: 如果长度和宽度一样 圆的半径是长度乘这个百分比得到的结果 如果长度和宽度不一样 产生的效果是宽高乘以百分数 ...

  4. 阶段1 语言基础+高级_1-3-Java语言高级_06-File类与IO流_05 IO字符流_6_字符输出流写数据的其他方法

    从1开始写写三个字符 最后多了个bcd 写入字符串 字符串的一部分

  5. mkdir: 无法创建目录"kk": 只读文件系统

    创建文件提示 root@hap1:/test>mkdir kk mkdir: 无法创建目录"kk": 只读文件系统 root@hap1:/test>mount .... ...

  6. 关于Tomcat的浅谈

    (今天看到tomcat已经更新到了9.0.24,这是一篇很早之前的文章,由于账号不想用了,所以搬到这里来,另外的账号要注销了) 1.Tomcat的下载 tomcat官网:http://tomcat.a ...

  7. window10 本地搭建SVN服务器

    window10本地搭建SVN服务器教程:https://www.cnblogs.com/warmlight/p/11075644.html 我按照这篇教程成功搭建SVN服务器. 有个比较坑的地方是w ...

  8. 修改属性item1(1变化)

    给imgList1,7,12,16添加数据 数据层data:{imgList1:[],imgList7:[],imgList12:[],imgList16:[],} 处理层let _this=this ...

  9. java锁的概念

    在学习或者使用Java的过程中进程会遇到各种各样的锁的概念:公平锁.非公平锁.自旋锁.可重入锁.偏向锁.轻量级锁.重量级锁.读写锁.互斥锁等待.这里整理了Java中的各种锁,若有不足之处希望大家在下方 ...

  10. Java-集合第四篇Queue集合

    1.什么是Queue 模拟队列数据结构,先进先出(FIFO),从队尾加元素,从队头取元素.     2.Queue接口中定义了如下几个方法: 1>void add(Object o):将指定元素 ...