如果是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. 1px渲染成2px的场景及解决方案

    1.场景一: IE6 下默认div最小高度为2px,如何创建高为1px的容器? .minContainer{font-size:0px;overflow:hidden}   2.场景二: 移动端高分辨 ...

  2. AWK之随心所欲-高手篇

    1.内置变量 变量名 描述 FS 输入字段分隔符,默认是空格或制表符 OFS 输出字段分隔符,默认是空格 RS 输入记录分隔符,默认是换行符\n ORS 输出记录分隔符,默认是换行符\n NF 统计当 ...

  3. js中parseInt()与parseFloat(),Number(),Boolean(),String()转换

    js将字符串转数值的方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...

  4. Ora01653 :是表空间不足

    解决方案:表空间中增加数据文件: ALTER TABLESPACE 表空间名称ADD DATAFILE 'D:\app\Administrator\oradata\orcl\Ibomis1.dbf' ...

  5. Ecshop二次开发必备基础

    EcShop二次开发学习方法 近年来,随着互联网的发展,电子商务也跟着一起成长,B2B,C2C,B2C的电子商务模式也不断的成熟.这时催生出了众多电子商务相关的PHP开源产品.B2C方面有Ecshop ...

  6. 20190928 On Java8 第二十三章 注解

    第二十三章 注解 定义在 java.lang 包中的5种标准注解: @Override:表示当前的方法定义将覆盖基类的方法.如果你不小心拼写错误,或者方法签名被错误拼写的时候,编译器就会发出错误提示. ...

  7. 第一次Java学习总结

    初学Java感觉还是蛮可以的,可是做起题目来还是不能得心应手,自己不懂得太多太多,还是需要不断努力去学啊!下面我就把这些天学到的知识点总结一下: 初学Java,我把目前所学知识点总结如下: 1.jav ...

  8. [Web 前端] 014 css 盒子模型

    1. 简介 元素在页面中显示成一个方块,类似一个盒子 把元素叫做盒子,设置对应的样式分别为 盒子的边框(border) 盒子内的内容和边框之间的间距(padding) 盒子与盒子之间的间距(margi ...

  9. [Python3] 012 元组:list,我们不一样!

    目录 0. 元组的独白 1. 元组的创建 2. 元组的特性 (1) 概述 (2) 少废话,上例子 1) 索引 2) 分片 3) 序列运算 4) 成员检测 3. 元组的遍历 (1) 简单总结 (2) 少 ...

  10. locale报错,显示中文乱码

    locale: Cannot set LC_CTYPE to default locale: No such file or directorylocale: Cannot set LC_MESSAG ...