如何在chrome浏览器中安装vue的调试工具
时间：2022-08-21 07:30:09
听说前段框架vue挺火的，就想折腾学习下这个超火的前端框架。框架确实简单，但是和传统的js html还是有些区别的。所以调试上面还是有些问题的。网上搜索了怎么安装Vue的调试工具，但是发现都有些问题，所以这里跟大家介绍下如何在chrome浏览器中安装vue的调试工具？
如何在chrome浏览器中安装vue的调试工具
1.安装 vue的调试工具 vue-devtools
从https://github.com/vuejs/vue-devtools 下载vue-devtools
2.安装nodejs https://nodejs.org/en/download/
3.安装yarn https://yarnpkg.com/en/docs/install
4. 解压下载下来的vue-devtools-dev
在vue-devtools-dev 目录下执行
yarn install
yarn run build
5.扩展Chrome插件
打开Chrome浏览器 > 更多程序 > 拓展程序
点击加载已解压程序按钮, 选择 vue-devtools-dev > packages > shell-chrome 放入, 安装成功如下图
6. vue-devtools使用
vue项目, 打开f12, 选择vue就可以使用了.
vue是数据驱动的, 这样就能看到对应数据了, 方便我们进行调试，如下图所示
标签：怎么安装Vue的调试工具,如何在chrome浏览器中安装vue的调试工具
0
投稿猜你喜欢
excel行列转换如何实现
2022-03-17 01:17:03
Windows10系统无限自动重启怎么解决？
2023-03-09 04:35:16
Win11打开explorer.exe无响应的解决办法
2023-06-30 08:17:42
如何解决win7小工具打不开无法正常
2023-06-01 15:44:23
果粉炸了，最强MacBook Pro真的来了！
2022-05-27 14:25:47
Mac默认截图保存格式要如何更改？
2022-06-10 15:22:40
怎么用金山卫士重装系统 金山卫士重置系统教程
2022-09-14 07:11:41
Win10 1709版怎么取消开机自动打开代理服务器?
2023-05-07 18:39:46
win10系统ip地址配置错误无法连接网络怎么解决?
2023-05-05 05:16:21
Win10桌面版相机应用下载 修复Surface Book/Pro 4不能拍照问题
2023-12-02 05:06:47
Win8.1系统安装后首次设置指导教程全过程详解
2023-07-23 14:59:28
Win7系统怎么简化一键重启或关闭休眠模式
2022-09-24 21:27:31
Windows10截屏后的图片在哪里？
2022-04-22 12:07:38
解决U盘文件系统类型没有NTFS格式的技巧
2022-11-26 14:20:26
如何让excel自动记录录入时间
2023-07-29 21:38:28
win7c盘越来越小的两种解决方法
2023-02-27 20:32:40
J For I = 1 To 1000 Step 2 J = J + I Next MsgBox 1到1000之间奇数和为 J End Sub 第二种代码：变量递减 Sub 求1到1000之间奇数和2
2023-04-15 21:50:17
Mac效率神器Alfred剪切板历史记录还可以这样用
2022-10-09 16:44:18
火影 T7C笔记本安装win10系统教程
2023-02-21 20:45:51
电脑版wps文档如何设置1.5倍行距
2022-02-08 10:54:40
