
vue调试工具vue-devtools安装及使用
发布日期:2021-05-07 01:01:49
浏览次数:8
分类:技术文章
本文共 512 字,大约阅读时间需要 1 分钟。
安装
1、到github下载:(下载一定要记得是master主分支的代码,默认克隆后进入的是dev分支,执行npm run build会报错)直接下载zip文件即可。
git clone下载的代码执行可能会出现问题,所以直接下载zip文件。
2、在vue-devtools目录下安装依赖包:
cd vue-devtoolscnpm install
3、依赖包下载完后执行cnpm run build,编译打包成功后会在shells下生成chrome文件夹。此文件夹就是用来放入chrome的扩展程序。
cnpm run build
4、扩展Chrome插件:
打开Chrome浏览器 >选择更多工具>扩展程序 >打开开发者模式
点击加载已解压的扩展程序, 找到刚才生成的chrome文件夹,选择 vue-devtools > shells > chrome 放入, 安装成功如下图
使用
5、 vue-devtools使用:
vue项目, 打开f12, 选择vue就可以使用了。
vue是数据驱动的, 这样就能看到对应数据了, 方便我们进行调试。
注意:为了避免安装出错,在安装时不要使用“npm”,要全部使用“cnpm”。
发表评论
最新留言
网站不错 人气很旺了 加油
[***.192.178.218]2025年03月10日 09时54分53秒
关于作者

喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
PYTHON UDP只能接收本地报文,无法接收其他主机通过路由器发过来的报文
2019-03-03
QLabel控件功能示例
2019-03-03
vue项目中报/sockjs-node/info错误
2019-03-03
如何处理前任程序员留下的代码
2019-03-03
20个非常有用的Java程序片段
2019-03-03
如何锻炼JAVA编程思路?
2019-03-03
Mybatis源码分析(四):属性接口之objectFactory
2019-03-03
全面了解 Nginx 主要应用场景
2019-03-03
最全的spring面试题和答案
2019-03-03
CentOS 8 已下载ntpdate 却无法使用crond进行时间同步
2019-03-03
Mybatis的这些坑!把我坑惨了!
2019-03-03
在 IntelliJ IDEA 中使用 Git,太方便了!
2019-03-03
7 个显著提升编码效率的IntelliJ IDEA必备插件
2019-03-03
企业API接口设计之token、timestamp、sign具体实现
2019-03-03
不懂别瞎搞!Redis 性能优化的 13 条军规!
2019-03-03
卸载 Navicat!事实已证明,正版客户端,它更牛逼……
2019-03-03
想彻底了解maven,有这篇文章足够了(中)
2019-03-03
Intellij IDEA 一些让人爱不释手的小技巧
2019-03-03
idea连接服务器远程调试(Dockerfile版)
2019-03-03
ElasicJob分布式定时任务
2019-03-03