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

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

时间: 06-12

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

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

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

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

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

100+ 超全的web开发工具和资源

转载出处:https://xituqu.com/170.html 作为Web开发者,这是好的时代,也是坏的时代.Web开发技术也在不断变化.虽然很令人兴奋,但是这也意味着Web开发人员需要要积极主动的学习新技术和新的编程语言,并愿意和渴望接受新的挑战,以适应变化.新的挑战可能会包括一些开发上的要求,如利用适应现有的框架来满足业务需求.测试一个网站,能从中知道出了哪些技术上的问题,并且我们针对这些问题进行优化和消除.便于后端的开发进程加快和测试.所以我们列出了完整的web开发所需要的工具和资源,助

超全的web开发工具和资源

作为Web开发者,这是好的时代,也是坏的时代.Web开发技术也在不断变化.虽然很令人兴奋,但是这也意味着Web开发人员需要要积极主动的学习新技术和新的编程语言,并愿意和渴望接受新的挑战,以适应变化.新的挑战可能会包括一些开发上的要求,如利用适应现有的框架来满足业务需求.测试一个网站,能从中知道出了哪些技术上的问题,并且我们针对这些问题进行优化和消除.便于后端的开发进程加快和测试.所以我们列出了完整的web开发所需要的工具和资源,助力开发者提高开发效率!学不止步,让我们努力成为一个优秀的开发者!

我想写一个前端开发工具(一):在npm发布模块

有必要说说我为什么要开始写这个 我最近忙于公司的项目,一直没有抽出时间来写文章.本来想每个月写一片文章,保质保量,无奈上个月没有坚持. 这段时间有点忙,主要是由于公司业务调整,我从原来的广告项目中调整到新业务线的前台页面开发了,和以前一样,还是带着3.4个兄弟姐妹.不同的是以前的项目周期普遍偏长,可以让每个同学有时间从头到尾的把项目吃透,而现在做C端的前台页面往往开发时间非常的短,比如我们就要在1.2个月完成业务线所有前台页面的开发.联调.测试.部署,以及下一步的迭代.由于是从零开始,不存在基于

windows环境下搭建vue+webpack的开发环境

前段时间一直在断断续续的看vue的官方文档,后来就慢慢的学习搭建vue的开发环境,已经有将近两周了,每到最后一步的时候就会报错,搞的我好郁闷,搁置了好几天,今天又接着搞vue的开发环境,终于成功了.我要把我所参考的文档和实际遇到的问题分享给大家.由于本人也是初级菜鸟一枚,如果有错误,还望谅解指正.下面言归正传: 所参考的文档链接:http://blog.csdn.net/syyling/article/details/52004892 http://www.cnblogs.com/ixxonli

Chrome 开发工具指南

Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 JavaScript 断点并可深入理解代码的最优化策略. 适用人群 这篇教程将会带你从头开始使用学习如何利用 Google 提供的组件进行 Chrome 上的相关开发调试工作. 通过本教程,你将学会如何使用这些工具,并且学会如何通过它来分析调试提供的 Demo . 学习前提 在你继续本教程之前,你必须对

前端开发福音!阿里Weex跨平台移动开发工具开源-b

阿里巴巴今天在Qcon大会上宣布跨平台移动开发工具Weex开放内测邀请.Weex能够完美兼顾性能与动态性,让移动开发者通过简捷的前端语法写出Native级别的性能体验,并支持iOS.安卓.YunOS及Web等多端部署. 对于移动开发者来说,Weex主要解决了频繁发版和多端研发两大痛点,同时解决了前端语言性能差和显示效果受限的问题.开发者可通过Weex官网申请内测:http://alibaba.github.io/weex/ 开发者只需要在自己的APP中嵌入Weex的SDK,就可以通过撰写HTML

html5开发工具哪些比较优秀

随着HTML5 发展如火如荼,以及html5技术的不断成熟,越来越多的程序员都在关注着HTML5,那么html5开发(http://www.maiziedu.com/course/web/228-2628/)工具哪些比较优秀呢?下面就给大家推荐10款优秀的HTML5开发公母,能让你高效的编写HTML5应用. Initializr Initializr 是制作 HTML5 网站最好的入门辅助开发工具,你可以使用提供的特色模板快速生成网站,也可以自定义,Initializr 会为你生成代码简洁的可定