安装步骤如下:
1、首先给大家提供一个git地址,虽然官网也有地址(https://github.com/vuejs/vue-devtools.git),我认为不太好用
给大家提供另一个git地址:

https://gitee.com/zhang_banglong/vue-devtools.git

打开里面就如下:

2、打开控制面板,进入到vue-devtools文件夹下,输入命令npm install或者cnpm install

3、上一步成功后,紧接着输入命令npm run build

4、打卡文件夹,找到shell文件夹,

5、打开shell文件夹,会找到一个chrome文件夹,就是它了!!!

6、打开谷歌浏览器(Chrome),找到扩展程序打开

7、选择“加载已解压的扩展程序”

8、选中刚才找到的chrome文件夹

9、选中后,“扩展程序”界面就如下,就完成了

10、本地运行一个Vue项目,F12打开控制台,如果没有,要刷新一下页面,或关闭浏览器重新打开

参考:https://blog.csdn.net/Sunshine__Girl/article/details/114709142

Chrome(谷歌浏览器)安装Vue插件vue-devtools的更多相关文章

  1. Chrome 谷歌浏览器安装使用 Postman 和 Sense 插件

    博客地址:http://www.moonxy.com 一.前言 Google Chrome 的特点是简洁.快速等.Chrome 支持多标签浏览,每个标签页面都在独立的"沙箱"内运行 ...

  2. Chrome中安装Firebug插件

    Chrome中的Firebug插件:Firebug Lite 1.Firebug Lite下载:http://chromecj.com/web-development/2015-05/471/down ...

  3. chrome不能安装adblock插件

    csdn简直就是个垃圾,名字山寨MSDN不说,一个页面数还十个广告.国人还这么多人捧,真是醉了.博客的话还是博客园,简洁,一切为了技术. 既然csdn是个垃圾,那么看部分文章时怎么少得了广告屏蔽插件a ...

  4. Vue安装及插件Vue Devtools

    vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...

  5. 从零开始系列之vue全家桶(2)安装调试插件vue Devtools

    小白安装前提是会用git,会从github上找东西. 第一步: 我们可以先从github上找到vue-devtools的项目,下载到本地.下载vue-devtools链接. 克隆方法:git clon ...

  6. 打包谷歌浏览器 Chrome 已安装的插件

    环境: OS - win7 64bit 旗舰版 Chrome - 37.0.2062.120 m 以 Smooth Gestures (一款鼠标手势插件)为例,在扩展程序面板 chrome://ext ...

  7. Chrome浏览器安装vue-devtools插件

    插件功能:方便在浏览器调试vue代码 插件git地址:https://github.com/vuejs/vue-devtools 因为chrome要FQ,打不开,所以不能直接进去安装拓展程序,只能选择 ...

  8. 如何给谷歌浏览器安装vue-devtools插件

    感谢原作者:https://www.cnblogs.com/alice-fee/p/8038367.html 安装方法1: 需正常打开chrome商店,搜索vuejs devtools 安装.chro ...

  9. 谷歌浏览器安装octotree插件

    Octotree Chrome安装与使用方法 Octotree Chrome作用: 主要使你在github查看项目时可以清晰明了的看到项目的结构以及具体代码,使下载代码更具有目的性,减少不必要代码的下 ...

  10. Chrome 手动安装.crx插件

    在网上自己下载.crx的离线插件文件.或者通过朋友打包.crx文件.打包方式可参照Chrome 打包扩展程序 方法一: 打开Chrome浏览器,地址栏输入 chrome://extensions/ 将 ...

随机推荐

  1. SpringMVC请求与响应

    请求 知识点1:@RequestParam 名称 @RequestParam 类型 形参注解 位置 SpringMVC控制器方法形参定义前面 作用 绑定请求参数与处理器方法形参间的关系 相关参数 re ...

  2. Smart200 设计注意设计

    2023.02.19 1.固件 2.一套西门子不够,输入输出点数不能满足要求,可配置两套(或多套)smart200,通讯实现一整套功能. 3.中大型PLC项目点数:32.16点位CPU:小型PLC项目 ...

  3. antdVue 重置select和input的样式 去掉蓝色换成灰色

    代码实现: <template> <div> <a-select mode="tags" style="width: 200px" ...

  4. Oracle function函数中无法使用update更新

    CREATE OR REPLACE FUNCTION changePY RETURN VARCHAR2 as PRAGMA AUTONOMOUS_TRANSACTION; --as 或者 is 后边 ...

  5. XYZtoZXY

    Quaternion XYZtoZXY(Vector3 p) { Vector3 v = new Vector3(p.x, -p.y, -p.z); Quaternion qx = Quaternio ...

  6. echarts:双y轴图表刻度均匀分布问题

    今天分享一个小问题,内容不多. 双y轴图表中,为了图表的美观,经常会隐藏一侧的y轴刻度线,仅显示一侧的刻度线.那么问题就来了,两个y轴的数据数值大小不同,常常会导致刻度线的刻度分布不均匀,该如何解决呢 ...

  7. yagmail 邮件模块

    安装 yagmail 安装yagmail:https://coding.net/s/01e2c2fe-82c0-4e05-a31b-f3e9e2dbc43a 下载完成之后,cmd 切换到文件目录下,执 ...

  8. 「SOL」网络流flow (模拟赛)

    题面 给定一张分层有向图,有 \(n\) 层,每层有 \(m\) 个点.只有从第 \(i\) 层的点连向第 \(i + 1\) 层的点的连边. 记 \(A(i,j)\) 表示从第 \(i\) 层的某些 ...

  9. 最新go语言学习教程

    go语言学习教程 集合了连接go routine.go连接redis.go连接kafka等示例,所有代码均经过实践,可以直接使用 https://github.com/fastbpmn/go-stud ...

  10. MyBatis_05(各种查询功能)

    MyBatis各种查询功能: 如果查询出的数据只有 "一条",可以通过: 1-实体类对象接收 2-List集合接收 3-Map集合接收,结果{password=123456, se ...