Vue开发调试神器: vue-devtools

1. 下载Chrome扩展插件
GitHub下载地址：

https://github.com/vuejs/vue-devtools

建议使用npm淘宝镜像按照依赖包

地址：http://npm.taobao.org/

　

命令行安装npm淘宝镜像：

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

　　

之后我们就可以使用cnpm代替npm按照依赖包了，npm安装依赖包确实太慢了.....

2. 安装编译

cnpm install

　　

cnpm run build

　　

打开shells>chrome>src>manifest.json并把json文件里的"persistent":false改成true

3. 将插件加入Chrome扩展插件

打开chrome浏览器，打开设置>更多工具>扩展程序>点击开发者模式；

点击“加载已解压的扩展程序”，然后选择vue-devtools-dev>shell>chrome文件夹；

最后打开一个vue项目，f12打开调试工具就可以进行vue项目的调试了。

Vue开发调试神器 vue-devtools的更多相关文章

  1. vue-devtools vue开发调试神器

    前言: 由于vue是数据驱动的,所以这就存在在开发调试中查看DOM结构并不能解析出什么. 但是借助vue-devtools插件,我们就可以很容易的对数据结构进行解析和调试. 一.下载chrome扩展插 ...

  2. vue学习记录（一）—— vue开发调试神器vue-devtools安装

    网上有些贴子少了至关重要的一步导致我一直没装上, 切记!!install后还需build,且install和build都在vue-devtools文件夹内执行 github下载地址 点击跳转 具体步骤 ...

  3. vue 代码调试神器

    一.序 工欲善其事,必先利其器.作为一名资深程序员,相信必有一款调试神器相伴左右,帮助你快速发现问题,解决问题.作为前端开发,我还很年轻,也喜欢去捣鼓一些东西,借着文章的标题,先提一个问题:大家目前是 ...

  4. 简简单单的Vue4（vue-cie@3.x,vue’Debug[调试]，vue‘sHttp）

    既然选择了远方,便只顾风雨兼程! __HANS许 系列:零基础搭建前后端分离项目 系列:零基础搭建前后端分离项目 vue-cli@3.x 创建项目 Vue的Debug(调试) Vue的Http请求 提 ...

  5. vue开发环境及vue相关

    一.安装node.js Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装node.js. 二.安装cnpm cnpm是淘宝对npm的镜 ...

  6. google vue开发调试插件，简便安装，亲测可用

    前言:开发vue项目,使用谷歌浏览器,不得不使用调试插件便于调试 插件地址如下: 链接:https://pan.baidu.com/s/159HqJMeFSF-w5z-tMi7drw 密码:ueez ...

  7. vue安装调试器Vue.js devtools

    一. 打开https://github.com/vuejs/vue-devtools,进入gitlab.往下翻找到: 找到installation,选择以chrome的拓展方式安装. 二. 这边选择添 ...

  8. 【前端vue开发架构】vue开发单页项目架构总结

    为营销活动设计的前端架构 主要的技术栈为 Vuejs,Webpack,请自行阅读如下技术或者框架的文档: 一.基础说明: node (https://nodejs.org/en/) npm (http ...

  9. vue 开发系列(十) VUE 作用域插槽

    使用场景 官方解释,有时让插槽内容能够访问子组件中才有的数据是很有用的.比如我们在使用ant-design-vue 的表格控件时. <a-table-column title="注释& ...

随机推荐

  1. JS预解释

    1.声明(declare)  var num   // 告诉浏览器在全局作用域中有一个num变量 定义(defined) num = 12 // 给我们的比变量进行赋值 2.var:在预解释时只是提前 ...

  2. Java 计算两点间的全部路径（一）

    算法要求: 在一个无向连通图中求出两个给定点之间的所有路径: 在所得路径上不能含有环路或重复的点: 算法思想描述: 整理节点间的关系,为每个节点建立一个集合,该集合中保存所有与该节点直接相连的节点(不 ...

  3. 2019-11-29-dotnet-获取指定进程的输入命令行

    title author date CreateTime categories dotnet 获取指定进程的输入命令行 lindexi 2019-11-29 08:35:11 +0800 2019-0 ...

  4. pyhton接口自动化测试-requests.post()

    一.方法定义 二.post方法简单使用 1.带数据的post 2.带header的post 3.带json的post 4.带参数的post 5.普通文件上传 6.定制化文件上传 7.多文件上传 一.方 ...

  5. zencart后台订单详细页显示产品图片和链接

    方法一: 找到admin/order.php 大约491行 for ($i=0, $n=sizeof($order->products); $i<$n; $i++) { 与 if (iss ...

  6. java医院交费机

    1.读卡器 钱币识别器 身份证识别等 2.与银行交互 socket客户端 发送 10001 返回解析 查询余额 密码发送 3.界面展示freemaker ftl文件展示 4.hql语句 5.webse ...

  7. python的并发模块concurrent

    Python3.2开始,标准库为我们提供了concurrent.futures模块,它提供了ThreadPoolExecutor和ProcessPoolExecutor两个类,实现了对threadin ...

  8. 【洛谷P4393】Sequence

    题目大意:给定一个长度为 N 的序列,每次可以合并相邻的两个元素,代价是两者中较大的值,合并之后的值也为两者较大的值,求合并 N-1 次后的最小代价是多少. 题解: 除了最大值以外,每个值均只会被合并 ...

  9. java常用类与包装类--包装类

    2.基本数据类型数据的包装类 局部变量中基本数据类型直接分配在栈中,而对象分配在堆中 将基本数据类型封装成对象的好处在于可以在对象中定义更多的功能方法来操作该数据 包装类主要功能:用于基本数据类型与字 ...

  10. 【NOIP2016提高A组模拟8.19】(雅礼联考day2)树上路径

    题目 给出一棵树,求出最小的k,使得,且在树中存在路径p,使得k>=S且k<=E.(k为路径p上的边的权值和). 分析 点分治,设当前为x的,求在以x为根的子树中,经过x的路径(包括起点或 ...