最近在研究vue单页面应用，一步一步用上全家桶，开发避免不了的就是调试工具，因为vue是进行数据驱动的，单从chrome里面进行element查看，查不到什么鸟东西，必须要进行对数据动向进行关查，那我就行一步一步教大安装

1.github下载地址：https://github.com/vuejs/vue-devtools

有Git的同学直接 git clone https://github.com/vuejs/vue-devtools

2.下载安成之后打开cmd进入vue-devtools文件夹把依赖装好npm install 之后再进行npm run build

最好装一个cnpm

3.然后打开shells>chrome>src>manifest.json 把里面的"persistent": false改为true

一切都万事具备了，打开chrome

1.打开里面的设置 > 点击扩展程序 > 点击开发者模式

2.再点击加载已解压的扩展程序，然后把shells>chrome这个文件夹放入就ok了

你再打开一个用vue写的网页，你再打开chrom调试工具你就会发现

大功告成！祝你们开发愉快

vue-devtoools 调试工具安装的更多相关文章

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

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

  2. Vue.js的安装及简单使用

    一.Vue简介 二.Vue.js的安装 2.1.npm安装 2.1.1.node.js介绍及安装 简介: 简单的说 Node.js 就是运行在服务端的 JavaScript. Node.js 是一个基 ...

  3. vue用npm安装删除模块element-ui mint-ui

    vue用npm安装删除模块element-ui mint-ui 在vue项目中先引入了element-ui,后来发现移动版的需要用mint-ui,所以需要先卸载了再安装.卸载element-ui:np ...

  4. vue之vue-cookies安装和使用说明

    vue之vue-cookies安装和使用说明npm官方链接:https://www.npmjs.com/package/vue-cookies 安装,在对应项目根目录下执行:npm install v ...

  5. Vue devtool插件安装后无法使用，提示“vue.js not detected”的解决方法

    vue devtool下载 极简插件  github vue devtool安装 点击谷歌浏览器箭头所指图标-更多工具-扩展程序   ①:直接将后缀为crx的安装包拖进下图区域即可自动安装     ② ...

  6. Vue. 之 npm安装 axios

    Vue. 之 npm安装 axios 使用指令: cnpm install axios 

  7. Vue. 之 npm安装Element

    Vue. 之 npm安装Element 前提: 相关运行环境以搭建完成,例如:Node.Npm等.    假如我的项目目录如下: D:\DISK WORKSPACE\VSCODE\CDS\cds-ap ...

  8. Chrome Vue Devtools插件安装和使用

    安装:fq后在chrome应用商店搜索 Vue Devtools并安装,安装成功后浏览器右上角有vue的图标 安装完毕后,打开含有vue框架的网站,这是vue图标会变亮,进入开发者工具,再右侧vue选 ...

  9. vue卸载与安装+vue创建项目

    vue卸载 npm uninstall -g vue-cli npm install -g @vue/cli 和 npm install -g @vue/cli-init 命令安装新版本vue-cli ...

  10. webstorm安装vue插件及安装过程出现的问题

    想要编辑器识别vue文件需要安装vue插件 1. 安装方法: File--> setting  -->  plugin ,点击plugin,在内容部分的左侧输入框输入vue,会出现1个关于 ...

随机推荐

  1. SqlDataAdapter 对datagridview进行增删改(A)

    这种方法主要是双击datagridview单元格,直接进行添加,修改,删除,在实际开发中并不太常用,另一种方法下一次在具体陈述. using System; using System.Collecti ...

  2. JS DOM操作（三） Window.docunment对象——操作属性

    属性:是对象的性质与对象之间关系的统称.HTML中标签可以拥有属性,属性为 HTML 元素提供附加信. 属性总是以名称/值对的形式出现,比如:name="value". 属性值始终 ...

  3. SQL - 先安装SQL2008 R2后安装AD导致无法正常登陆数据库(无法启动MSSQLSERVER)

    分析原因:安装AD后,系统改为使用域用户登陆,原先安装SQL时设置的“本地用户”信息已经修改,当前(域)用户没有权限访问MSSQLSERVER实例文件夹或整个SQL文件夹. 解决方法: 1.打开“服务 ...

  4. 乐字节-Java8新特性之函数式接口

    上一篇小乐带大家学过 Java8新特性-Lambda表达式,那什么时候可以使用Lambda?通常Lambda表达式是用在函数式接口上使用的.从Java8开始引入了函数式接口,其说明比较简单:函数式接口 ...

  5. Java基础——Servlet（五）

    哈哈哈...学习Servlet学了半个多月,因为中间有比较灰心的时候,有几天是啥都不学了的状态,看了好几部励志的电影.呃~还是得继续吧.本来计划是好好夯实这里的基础,结果在网找到了介绍比较全面的视频, ...

  6. 绘图：Matplotlib

    用于绘制一些数据图,同学推荐的,挺好用.非常好的官网文档:http://matplotlib.org/contents.html 0. 安装 可以直接pip install,还有一些依赖就按照提示来吧 ...

  7. vue-resource获取不了数据，和ajax的区别，及vue-resource用法

    前几天用vue-resource调用接口,用post方式给后端,发现后端php接受不到数据,这好奇怪,最后发现提交给后端的时候 需要加一个参数 就是:emulateJSON : true 这句话的意思 ...

  8. spring 3.2.2后springjdbc中不用queryforInt了

    今天才发现,原来spring 3.2.2之后,jdbctemplate中的queryForInt已经被取消了! 参考博客:http://jackyrong.iteye.com/blog/2086255

  9. 语义SLAM的数据关联和语义定位（四）多目标测量概率模型

    多目标模型 这部分想讲一下Semantic Localization Via the Matrix Permanent这篇文章的多目标测量概率模型.考虑到实际情况中,目标检测算法从单张图像中可能检测出 ...

  10. 【Kibana】Kibana入门教程

    一.Kibana简介及下载安装 Kibana是专门用来为ElasticSearch设计开发的,可以提供数据查询,数据可视化等功能. 下载地址为:https://www.elastic.co/downl ...