转载自：http://blog.csdn.net/sinat_17775997/article/details/70224280

最近在研究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-devtools 必备开发工具的更多相关文章

  1. Vue.之.项目开发工具选用

    Vue.之.项目开发工具选用 上篇文章记录了创建项目,这篇文件记录,如何对创建的项目进行开发.这里选择一个工具:Visual Studio Code (请自行下载安装) 1. 打开VSCode工具,并 ...

  2. 学习PHP的必备开发工具

    对于PHP开发者,在互联网上有很多可用的开发工具,但对于初学者不知道哪个php开发工具比较好,找到一个合适的PHP开发工具是很难的,需要花费很多的时间精力.所以,今天常青春工作室就为初学者推荐几个最好 ...

  3. Java的必备开发工具

    身为一个Java开发的爱好者,你不得不承认需要安装以下软件 NO.1 Java开发工具包 Java JDK 可以说这个工具包不得不安装,因为这个工具包是开发Java程序的核心! Java JDK工具包 ...

  4. Android Java 程序员必备开发工具

    对于Java,有两种截然不同的观点:一种认为Java是最简单功能最强大的编程语言之一,另一种则表示这种编程语言既难用又复杂. 下面这些工具或许功能和作用不同,但是有着一个共同的主旨,那就是——它们都是 ...

  5. DoNet 高效开发必备开发工具

    工欲善其事,必先利其器,没有好的工具,怎么能高效的开发出高质量的代码呢? 本文为 ASP.NET 开发者介绍一些高效实用的工具,包括 SQL 管理,VS插件,内存管理,诊断工具等,涉及开发过程的各个环 ...

  6. Android开发工具综述，开发人员必备工具

    安卓开发工具汇总.开发者必备.安卓开发过程中须要用到各种工具,作为一名安卓开发者,有木有感到亚历山大,那么多工具! 今天给大家汇总了一下安卓开发工具,安卓开发者必备利器. 1.Draw 9-Patch ...

  7. SharePoint 2013常用开发工具分享

    众所周知,一款好的开发工具不仅能提高项目开发效率,而且能够协助开发人员简化开发流程.本文汇总几款SharePoint 2013开发常用开发工具,希望能够对大家有所帮助.如果您有更好的工具,没有包含在本 ...

  8. SharePoint 2013常用开发工具

    SharePoint 2013常用开发工具分享 2014-04-01 00:59 by jv9, 589 阅读, 1 评论, 收藏, 编辑 众所周知,一款好的开发工具不仅能提高项目开发效率,而且能够协 ...

  9. Vetur：VSCode下强大的Vue开发工具

    Vue自从发布以来就一直受到前端开发人员的热爱,而除了一些本身优秀的特征之外,还有就是丰富的插件和工具的支持和更新.虽然现在的编辑器需要安装相应的plugins才能进行Vue组件化开发,但是越来越多优 ...

随机推荐

  1. Openssl rand命令

    一.简介 rand命令用来产生伪随机字节,随机数字产生器需要一个seed,在没有/dev/srandom系统下的解决方法是自己做一个~/.rnd文件 二.语法 openssl rand [-out f ...

  2. class Qstring has no member named to Ascii

    人家修改了.真的没有toAscii了.不过可以用toLatin1或者qPrintable()

  3. vscode安装设置go

    vscode安装设置go vscode安装go配置 1.下载最新的vscode: https://code.visualstudio.com/docs/?dv=win 2.下载go: https:// ...

  4. JVM内存模型以及堆分配参数

    程序计数器: 存放下一条要运行的指令:每个线程都必须用一个独立的程序计数器,用于记录下一条要运行的指令.程序计数器是一块线程私有的内存空间. JAVA虚拟机栈: 线程私有的内存空间,它保存方法的局部变 ...

  5. CSS实现input默认文字灰色有提示文字点击后消失鼠标移开显示

    CSS实现input美化操作默认是为灰色,并且有提示 如下图 鼠标点击后文字消失,鼠标移开后文字显示 给input入下图添加代码 style="color:#cccccc; outline: ...

  6. 用jvm指令分析String 常量池

    其他博友的不同理解方式:  http://hi.baidu.com/boywell/item/d5ee5b0cc0af55c875cd3cfd 我们先来看一个类 public class javaPT ...

  7. zuluCryt cli howto

    1.解锁卷的命令. zuluCrypt-cli -o -d /dev/sdc1 -m blabla -e ro -f /home/keyFile zuluCrypt-cli -o -d /dev/sd ...

  8. Cannot change version of project facet Dynamic Web Module to 2.4.

    解决办法,找到项目目录,将.settings  target  .classpath  .project 删除 重新引入项目 原因是 web.xml 文件里<web-app 里的与.settin ...

  9. NIOS II 自定义IP核编写基本框架

    关于自定义IP .接口 a.全局信号 时钟(Clk),复位(reset_n) b.avalon mm slave 地址(as_address) 片选(as_chipselect /as_chipsel ...

  10. SQL 语句case when

    简介 case when 一般有两种书写方式,多用于查询判断 1. case 列名 when '' then '空' ' then '成功' ' then '失败' else '其他' end as ...