浏览器的vue3调试工具

已于 2022-11-28 17:46:02 修改
阅读量645 收藏
点赞数
分类专栏： vue 文章标签： chrome 前端 javascript
于 2022-11-23 10:55:04 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jiangyafu0/article/details/127996334
版权

1.从github下载源码(6.4.5)

https://github.com/vuejs/devtools

2.node版本19.1.0

3.安装yarn

npm install -g yarn

4.在devtools-6.4.5目录下安装编译

yarn install
yarn run build:watch
yarn run dev:chrome

5.安装插件（谷歌浏览器、火狐浏览器）：devtools-6.4.5\packages\shell-chrome

地址 浏览器vue3插件下载

名字叫jay
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
vue3 devtools配置
m0_57442975的博客
12-21 1181
vue3项目中不免要使用调试工具vue3 devtools，试了网上的几种方法，使用下面这种成功安装vue3 devtools，在这里记录和分享。
Vue3谷歌浏览器调试工具Vue.js devtools 6.1.4
05-30
Vue.js devtools 6.1.4,Vue3谷歌浏览器调试工具。开发vue3必备开发工具，跟踪数据便于调试，解决数据问题。
2024年最全vue调试工具vue-devtools安装及使用(支持vue3版本)(1)，面试完腾讯我才发现这些知识点竟然没掌握全
最新发布
2401_84619467的博客
05-07 1775
全网独播-价值千万金融项目前端架构实战从两道网易面试题-分析JavaScript底层机制RESTful架构在Nodejs下的最佳实践开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】一线互联网企业如何初始化项目-做一个自己的vue-cli思维无价，看我用Nodejs实现MVC代码优雅的秘诀-用观察者模式深度解耦模块前端高级实战，如何封装属于自己的JS库VUE组件库级组件封装-高复用弹窗组件cd devtools-6.0.0-beta.153.安装所需npm依赖包，这里建议用国内淘
【Vue3 知识第二讲】Vue3新特性、vue-devtools 调试工具、脚手架搭建
前端知识分享喵
09-01 2443
Vue3新特性、vue-devtools 调试工具、脚手架搭建
【前端开发工具】VUE3 devtools安装
zxsy19966的博客
07-01 1万+
Vue3 devtools安装
正确开启vue3.0调试工具vue-devtools
球球不吃虾WHR2349博客
03-12 7474
正确开启vue3.0调试工具vue-devtools 1.去https://github.com/vuejs/vue-devtools官网下载，注意下载beta版本的，这个才是vue3.0用的 2.如果是用火狐浏览器，点击beta应该是直接进入火狐的插件中心，直接安装就行了。 如果安装谷歌版的，下载vuejs_devtools_beta-6.0.0.7-an+fx.xpi文件，6.0.0.7是我下载时候的最新版本号，下载好以后解压，进去npm install一下。然后就安装一下就o了。 我火狐和谷歌都安
Vue3中vue-devtools调试工具安装
11-29 2796
用于调试Vue.js应用程序的Chrome和Firefox DevTools扩展。Chrome devtools扩展用于调试Vue.js应用程序。Vue Devtools_6.4.5_chrome扩展插件最新版下载_极简插件。重新打开谷歌浏览器，并打开vue3项目，按F12 ，出现以下界面即为安装成功。然后将之前解压的crx文件拖拽到扩展程序界面，按照对应提示点击确认即可。或者 点击右上角 ==》选择更多工具按钮 ==》选择扩展程序。打开谷歌浏览器，地址栏输入。
vue3浏览器调试插件
04-27
Vue3浏览器调试插件是专为开发者设计的强大工具，它极大地简化了Vue3应用程序的调试过程，让开发者能够深入理解并高效地排查Vue3应用中的问题。Vue.js是一款流行的前端框架，尤其在单页应用程序（SPA）开发中广泛...
浏览器调试vue3工具.zip
12-16
浏览器是进行前端调试的主要平台，本资料“浏览器调试vue3工具.zip”应该包含了帮助开发者更有效地在浏览器环境中调试Vue3应用的工具和指南。 首先，我们来了解一些基础的Vue3调试技巧。Vue3引入了全新的...
vue浏览器调试工具
07-03
"Vue浏览器调试工具"，也被称为Vue DevTools，是一个强大的Chrome和Firefox扩展，它为Vue开发者提供了深入洞察应用状态的能力。 Vue DevTools 可以帮助开发者查看和操作Vue组件的层级结构、属性、计算属性、监听器...
vue2以及vue3 chrome调试工具
09-22
总之，Vue 2和Vue 3 Chrome调试工具是Vue开发者不可或缺的利器，它们极大地提高了开发效率，简化了调试过程，让Vue应用的开发变得更加顺畅。无论是初学者还是经验丰富的开发者，都能从中获益良多。
Vue3 beta 调试工具
06-17
Vue3调试工具,直接解压，加载到chrome扩展中就可用。
vue最新devtools，vue3的调试工具
10-27
Vue Devtools 为此提供了专门的检查和调试工具，可以查看组件的setup函数以及使用到的ref和reactive对象。通过这些工具，开发者可以清晰地看到数据的依赖关系，以及组件内部的状态变化。 此外，Vue 3中的Teleport...
强烈推荐一款 Vue3 + Vite 调试神器，彻底抛弃 Vue Devtools ！！！
pythonhy的博客
08-18 3126
相信使用 Vue 的同学应该对 Vue Devtools 浏览器插件并不陌生，但是有些同学由于网络问题无法下载安装插件，所以今天给大家推荐一款更好用的插件 vite-plugin-vue-devtools，无需浏览器安装，直接使用npm安装即可使用，并且界面也很美观，功能更加强大。
Vue3-devtools开发者工具正确安装方法
热门推荐
Zhang_wang_yun的博客
05-30 1万+
学习Vue3自然离不开调试工具Vue3-Devtools，所以我们需要来下载这个调试工具并放入谷歌浏览器里的扩展程序里面。帮助我们更好的调试vue3里的程序。
vue基本使用
小脆筒style的博客
10-31 562
vue基本使用 vue简介 vue特性 MVVM vue 的基本使用 一、vue简介 官方给出的概念：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的前端框架 二、vue特性 数据驱动视图 双向数据绑定 1. 数据驱动视图： 在使用了 vue 的页面中，vue 会监听数据的变化，从而自动重新渲染页面的结构。示意图如下： 2. 双向数据绑定 在填写表单时，双向数据绑定可以辅助开发者在不操作 DOM 的前提下，自动把用户填写的内容同步到数据源 中。示意图如下：
vue3 chrome浏览器调试工具vue-devtools
qq_41989905的博客
02-21 1038
然后请打开你的chrome浏览器，点击右上角的三个点 然后点击扩展程序，然后解压，找到以下路径 devtools-main\packages。再然后，直接把 shell-chrome 文件夹整个拖进去就可以了；里面有一个 shell-chrome 这个就是你所需要的文件；如何使用最新的 vue-devtools。点进去以后下载整个压缩包。
VUE3 vue-devtools 调试工具下载安装
NiKlaus729的博客
06-06 6844
VUE3下载安装devtools 调试工具
2024年React进阶（一）：学习资料汇总_react 最新学习资料，前端开发基础
2401_84437170的博客
05-04 168
全网独播-价值千万金融项目前端架构实战从两道网易面试题-分析JavaScript底层机制RESTful架构在Nodejs下的最佳实践开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】一线互联网企业如何初始化项目-做一个自己的vue-cli思维无价，看我用Nodejs实现MVC代码优雅的秘诀-用观察者模式深度解耦模块前端高级实战，如何封装属于自己的JS库VUE组件库级组件封装-高复用弹窗组件c=reactjs全网独播-价值千万金融项目前端架构实战。
vue3 浏览器调试工具
05-17
Vue3 在浏览器中的调试工具和 Vue2 是一样的，仍然使用 Vue Devtools。 你可以在 Chrome 浏览器中安装 Vue Devtools 插件，然后打开开发者工具，选择 Vue 选项卡，即可查看应用程序的组件树、数据、事件等信息。 ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值