备注:在安装配置Vue-devtools过程中,很多博客上基本上都要求去github官网下载vue-devtools-dev压缩包。下载并解压该压缩文件后,便以管理员的方式打开命令行窗口,然后利用npm进行intsall(命令行:npm install),接下来输入npm install bulid。当然,利用这种方法有一个前提,便是要在此之前先安装好npm,要想安装npm,最便捷的方法是下载一个集成的node.js,而前提是要有一定的node基础。在通过上述办法来安装vue-devtools时,会出现许多错误,比如会缺少某些必要的文件或者依赖包,而为了处理这些问题,还费时费力,还会打击心态,最后还不一定能够配置成功(本人亲测有效)。对此,查询了大量的安装教程,终于成功安装了vue-devtools,特此,将本人的总结经验分享给大家,若有什么不足之处,可随时与博主进行交流讨论。

vue-devtools文件已上传博主主页文件,想要安装vue-devtools工具的朋友可点击博主主页文件进行下载。

  1. vue-devtools解压
    点击下载vue-devtools安装工具包,下载vue-devtools文件之后,根据自己需要解压到指定盘符下,请记住你所解压的位置,我解压在D盘下。具体操作如下图所示:

  2. 工具安装步骤
    打开谷歌浏览器,输入网址:chrome://extensions/ ,会进入到扩展程序页面,点击开发者模式,之后点击加载已解压的扩展程序。具体操作如下图所示:

    点击加载之后,找到之间解压的vue-devtools文件夹,选择chrome文件夹,点击选择之后,扩展程序便引入成功。具体的操作流程如下图所示:

    点击右上角的扩展程序,点击固定,便可看到vue-devtools工具标志,则证明vue-devtools工具安装成功。具体操作如下图所示:

    若当前页面的V标志为灰色,可重新换一个网页进行尝试,可以哔哩哔哩登录网页或者其他网页为例,若亮则vue-devtools工具安装成功。具体操作如下图所示:

    或者在利用Win+R快捷键,输入cmd,打开命令行之后,输入命令:vue ui,便会跳转到vue项目管理器,点击f12便可看到vue-devtools工具是否安装成功。具体操作如下图所示:

  3. 遇到问题及解决办法
    若遇到Vue.js not detected这种情况,点击扩展程序中的管理扩展程序,点击扩展程序的详细信息,会进入到下一个页面,将允许访问文件网址打开即可,然后切换至另一个页面便可看到V标志变亮。表示vue-devtools工具成功安装。具体操作如下图片所示:

vue-devtools安装教程(简单易上手)相关推荐

  1. Spring+Vue前后端传输图片-简单易上手,copy直接用

    文章目录 前言 一.前端传后端 二.后端接受,并返回给前端 三,前端接受返回 前言 前端传图片给后端的方式,是通过bsae64传输,然后后端把接收到的转化为字节流在把图片展示出来 后端传前端直接传输了 ...

  2. 本行没有输入值结余隐藏_仓库库存管理系统,内含逻辑公式,自动结余库存!操作简单易上手...

    仓库库存管理系统,内含逻辑公式,自动结余库存!操作简单易上手 仓库出入库管理系统 入库单 出入库单号自动生成,如需修改前缀,可根据提示自行修改.在设置中,根据实际情况对必须填写的项输入,方便后期可自动 ...

  3. 弥散阴影html,超赞!一份简单易上手的青春弥散阴影修炼手册

    @笔戈科技 :一份简单易上手的青春弥散阴影修炼手册!九张长图/3种方法/3种效果/4个技巧,包你学会设计时下流行的骚气通透的弥散阴影效果. 投影法较为简单粗暴,但是投影效果较为粗糙缺乏立体感,投影颜色 ...

  4. 一款简单易上手的ARM单片机开发IDE—STduino

    一款简单易上手的ARM单片机开发IDE-STduino 前言 STduino介绍 前言 第一眼看到这个IDE,第一反应就是名字有点像TrueSTUDIO,然后我上网查了一下,当然是没有关系的,只能说是 ...

  5. 简单绘图软件实现mfc大作业_生产流程图怎么做?简单易上手的流程图工具

    生产流程图是什么呢?首先,生产流程指的是在生产的过程中,劳动者通过利用一定的生产设备或工具,将各种原材料.半成品投入,按照一定顺序进行加工,最终得到成品产出的整个过程.而生产流程图则是使用图表符号的形 ...

  6. Vue Devtools安装(谷歌浏览器插件:)

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

  7. 【C51】基于51单片机的简易频率计(附代码、无需外设、小白简单易上手)

    基于51单片机的简易频率计(无需外设.小白简单易上手)   代码较为简单,大概思路是通过定时器单位时间内外部中断上升沿触发的次数来计算实际频率. /基于51单片机的简易频率计#include<r ...

  8. 实用的3款视频添加水印软件分享,简单易上手

    如今刷短视频已经成为许多小伙伴饭后闲暇之余消遣的项目,也有不少人因此加入了创作短视频的队列.但是在分享前,最好是对自己的作品加上水印.为什么呢?第一是可以起到更好的宣传作用,第二是防止他人盗窃作品内容 ...

  9. focusky怎么制作html5,一款简单易上手的3D动态PPT制作软件Focusky

    原标题:一款简单易上手的3D动态PPT制作软件Focusky Focusky动画演示大师 是一款傻瓜式的动画宣传片.微课.3D 动态 PPT 制作工具.通过缩放动作,让演示文档变成生动有趣的动画,制作 ...

  10. minGW 2022/7/27 安装教程 简单可用

    minGW 2022/7/27 安装教程 简单可用 链接: linkhttp://c.biancheng.net/view/8114.html

最新文章

  1. hadoop大数据集群完全分布式部署实操篇:HDFS2.9.2、HBASE2.2.6、YARN2.9.2、SPARK2.4.7,ZOOKEEPER3.6.2
  2. c#如何通过ftp上传文件_定时上传文件到ftp,如何使用工具定时上传文件到ftp
  3. SIGIR 2021|重新思考Attention在CTR预估中作用
  4. 多继承-概念、语法和基本演练
  5. C 双向链表的简单排序实现
  6. day4----函数-闭包-装饰器
  7. 什么是javax.ws.rs.core.context? [ 第1部分 ]
  8. 类的 三大特性 封装,继承,多态 overload与override的区别
  9. extends 抽象方法_关于abstract抽象类的理解
  10. 使用postman操作ElasticSearch
  11. 14岁的男孩说想学生信,应该给予哪些指导?
  12. 离散余弦变换原理及实现【转载】
  13. linux box 信息发布,使用Instantbox快速搭建一个开箱即用的Web端临时Linux系统
  14. windows10环境下curl 安装与配置
  15. MPU6050的数据获取、分析与处理
  16. 手把手教你如何自学计算机,绝对的干货满满!!!
  17. 齐治堡垒机前台远程命令执行漏洞(CNVD-2019-20835)分析
  18. Ubuntu20.04 idea/pycharm 搜狗中文输入法不跟随光标问题
  19. 【unity细节】关于资源商店(Package Maneger)无法下载资源问题的解决
  20. Memcache介绍

热门文章

  1. android 布局 字体大小,android布局文件怎样设置字体
  2. Typecho 轻量级响应式主题Yangtuo发布
  3. OpenCV3+VS2017+单目标定+双目标定+双目测距
  4. C# XmlDocument 创建xml字符串
  5. 中国女性抗老态度白皮书
  6. 高效使用Ubuntu技能攻略
  7. Android四大组件之broadcast广播使用整理笔记
  8. AcWing 426. 开心的金明(01背包,我爱喝水,天天健康,牛客切不出,喝下水)
  9. Tomcat环境变量配置及安装过程中错误解决方法记录
  10. 正则表达式(QQ校验)