vue调试工具vue-devtools安装及使用

本文主要介绍 vue的调试工具 vue-devtools 的安装和使用

工欲善其事, 必先利其器, 快快一起来用vue-devtools来调试开发你的vue项目吧

安装: 

1.到github下载:

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

2.在vue-devtools目录下安装依赖包

cd vue-devtools
cnpm install

3.修改manifest.json文件

把"persistent":false改成true

 4.编译代码

npm run build

5.扩展Chrome插件

Chrome浏览器 >  更多程序 > 拓展程序 

点击加载已解压程序按钮, 选择 vue-devtools > shells > chrome 放入, 安装成功如下图

 6. vue-devtools使用

vue项目, 打开f12, 选择vue就可以使用了.

vue是数据驱动的, 这样就能看到对应数据了, 方便我们进行调试

 怎么样, 是不是感觉工作效率提高了呢

温情提示: 

1.vue必须引入开发版, 使用min压缩版是不能使用devtools进行调试的

2.安装后, 需要关闭浏览器, 再重新打开, 才能使用

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏企鹅号快讯

Linux系统下常用的数据备份方法

Linux作为网络操作系统,在服务器方面的应用越来越广泛。作为专门的网络服务器,一个重要功能就是对服务器数据进行备份,以确保数据的安全。本文将介绍在Linux系...

2158
来自专栏张戈的专栏

Llinux文件目录权限及chmod命令简析

这些天,在互推联盟群(344134224 )遇到几例关于 WP 升级失败以及 FTP 账号登陆的问题。最终发现都是主机的目录权限设置存在问题。比如,博友【PPT...

4346
来自专栏小明plus

在2018年如何优雅的开发一个typescript语言的npm包?

很多时候,我们可能想要用 typescript 语言来创建一些模块,并提交到 npm 供别人使用,

1.1K10
来自专栏xingoo, 一个梦想做发明家的程序员

Oozie分布式工作流——Action节点

前篇讲述了下什么是流控制节点,本篇继续来说一下什么是 Action Nodes操作节点。Action节点有一些比较通用的特性: Action节点是远程的 ...

2196
来自专栏Brian

Debian JDK安装及配置

Debian Oracle JDK开发环境配置 ---- Debian是一个非常规范且非常稳定的Linux操作系统,国内使用比较多的Ubutun是他的儿子。一般...

4107
来自专栏电光石火

使用Maven创建web项目

使用eclipse插件创建一个web project 首先创建一个Maven的Project如下图 ? 我们勾选上Create a simple ...

25510
来自专栏IT 指南者专栏

今天花时间最多的两个小错误

微信公众号:compassblog 欢迎关注、转发,互相学习,共同进步! 有任何问题,请后台留言联系! 1、配置Maven项目的pom.xml文件报错 (1)、...

2867
来自专栏大大的微笑

Java线程池

       概述:         线程池,从字面含义来看是管理同一组同构工作线程的资源池。线程池与工作队列是密切相关的, 工作队列保存了所有等待执行的...

2326
来自专栏菜鸟程序员

Android 调试桥

1833
来自专栏我的博客

php+ftp

$ftp_server = “122.207.221.101”;//主机ip或者域名 $conn_id = ftp_connect($ftp_server) o...

3505

扫码关注云+社区

领取腾讯云代金券