vue-devtools 必备开发工具

转载自: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调试工具你就会发现

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

时间: 2024-11-08 00:09:27

vue-devtools 必备开发工具的相关文章

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

Vue.之.项目开发工具选用 上篇文章记录了创建项目,这篇文件记录,如何对创建的项目进行开发.这里选择一个工具:Visual Studio Code (请自行下载安装) 1. 打开VSCode工具,并加载项目: File -> Open Folder (然后选择之前创建的项目:ntrc-app) 2. 通过VSCode打开终端: View -> Debug Console  3. 输入指令,再次运行项目: cnpm run dev (如果之前在cmd黑窗口启动的项目没有关闭的话,这个应用端口是

程序员必备开发工具,提高开发效率的神兵利器,大多都是免费的哦

1.IntelliJ IDEA 这个就不用多说了,地球人都在用,很好的开发工具,并且插件齐全,更牛逼的是支持各种语言开发. 官网地址:http://www.jetbrains.com/idea/ 注册码地址:http://idea.lanyus.com/ 2.DataGrip数据库客户端管理 Navicat其实是更好的一个数据库客户端管理工具,但是收费,很麻烦,就又找了一个,也是比较好用的,DataGrip也是IntelliJ IDEA中的一个工具. 官网地址:https://www.jetbr

Android Java 程序员必备开发工具

对于Java,有两种截然不同的观点:一种认为Java是最简单功能最强大的编程语言之一,另一种则表示这种编程语言既难用又复杂. 下面这些工具或许功能和作用不同,但是有着一个共同的主旨,那就是——它们都是为了给Java编码和开发提供卓越的支持. 1. JDK(Java开发工具包) 如果你打算用Java开发一些小程序和应用程序,那么首先得给自己准备一个类似于JDK的工具,其中包括必要的Java Complier.Java Runtime Environment(JRE)和Java API.这是开始Ja

DoNet 高效开发必备开发工具

工欲善其事,必先利其器,没有好的工具,怎么能高效的开发出高质量的代码呢? 本文为 ASP.NET 开发者介绍一些高效实用的工具,包括 SQL 管理,VS插件,内存管理,诊断工具等,涉及开发过程的各个环节,让开发效率翻倍. Visual Studio Visual Studio Productivity Power tool: VS 专业版的效率工具. Web Essentials: 提高开发效率,能够有效的帮助开发人员编写CSS, JavaScript, HTML 等代码. MSVSMON: 远

安卓开发工具汇总,开发人员必备利器

安卓开发工具汇总,开发人员必备!安卓开发过程中需要用到各种工具,作为一名安卓开发人员,有木有感到亚历山大,那么多工具!今天给大家汇总了一下安卓开发工具,安卓开发人员必备利器! 1.Draw 9-Patch 这个九宫格绘画安卓开发工具(draw9patch.bat)可以让你很容易的通过一个所见即所得(WYS|WYG)的编辑器来创建一个九宫格NinePatch图. 2.ProGuard ProGuard 是一个免费的 Java类文件的压缩,优化,混肴器.它删除没有用的类,字段,方法与属性.使字节码最

Java程序员必备的 15框开发工具

15款Java程序员必备的开发工具 如果你是一名Web开发人员,那么用膝盖想也知道你的职业生涯大部分将使用Java而度过.这是一款商业级的编程语言,我们没有办法不接触它. 对于Java,有两种截然不同的观点:一种认为Java是最简单功能最强大的编程语言之一,另一种则表示这种编程语言既难用又复杂. 下面这些工具或许功能和作用不同,但是有着一个共同的主旨,那就是——它们都是为了给Java编码和开发提供卓越的支持. 1. JDK(Java开发工具包) 如果你打算用Java开发一些小程序和应用程序,那么

Java程序员必备的6款最佳开发工具

工欲善其事,必先利其器.每一个 Java 程序员都有其惯用的工具组件.对于 Java 程序员,各种有用的软件和工具泛滥成灾.初级开发人员要么找不到合适的工具,要么在寻找过程中浪费了大量的时间.下面,我将为大家介绍 6 款 Java 开发必备工具. 1. Notepad++ Notepad++是编辑 XML.脚本,甚至做简单笔记的最佳工具.关于这个工具最棒的一点是,你在 Notepad++ 打开过的每个文件,即使你关闭之后,它仍然存在.所以它能减少因意外删除重要内容而造成的麻烦.它还可以当作比较插

Linux开发环境必备十大开发工具

原文链接Linux是一个优秀的开发环境,但是如果没有好的开发工具作为武器,这个环境给你带来的好处就会大打折扣.幸运的是,有很多好用的Linux和开源开发工具供你选择,如果你是一个新手,你可能不知道有哪些工具可用.本文将介绍其中十个杰出的开源开发工具,它们将帮助你提升自己的开发效率. 1.Bluefish Bluefish是进行Web开发时最受欢迎的IDE之一.它能够处理编程和标记语言,但是该工具的重点用途在于创建动态和交互式网站.和许多 Linux应用程序一样,Bluefish是一个轻量级工具,

html5开发入门 必备学习工具推荐

在这个IT互联网飞速发展的时代,html5已然成为了web开发中的热门话题,越来越多的小伙伴想要学习一门过硬的技术,当然html5语言的出世也受到了广大开发者们的喜爱,它被看做是web开发者创建流行web应用的利器,如今在这日新月异的移动时代,除了ios.android两大平台,还有windows phone等等多个竞争,这也恰恰给html5展现了机会,接下来简单了解下html5开发入门学习必知的几款主流工具. Dreamweaver CS6 Dreamweaver CS6 是世界顶级软件厂商A