背景:
在进行vue开发时,我们需要知道页面数据的状态,在以往的vue项目开发时,我都采用的是使用vue-devtools进行调试,可以很好的帮我们获取到当前页面的数据信息,而最近在开发时我发现我的vue-devtools不生效了,意味着我的调试工作难度大大增加,因此打开了百度,最后得出的结论是,我的vue-devtools的版本太老了,不支持对vue3进行检索,最后呢解决的方法就是去升级vue-devtools,最新版本的vue-devtools是支持对vue3的检索的。

安装:
1、直接去到官网下载.crx文件 :https://www.crx4chrome.com/crx/107268/

2、打开浏览器设置=>扩展程序,将上一步下载的vue-devtools文件用拖动的方式导入扩展程序页面进行安装,至此,你一成功安装了支持vue3的vue-devtools,关掉浏览器重新打开就会发现在调试界面又出现了我们熟悉的vue调试面板。

**注意:**可能你会有安装后打开vue3的项目依然不生效的情况出现,那是因为你没有把之前安装的vue-devtools进行禁用,两者产生了冲突,禁用之前的vue-devtools就可以了,记得从新打开浏览器。

最后附上参考博客:
https://www.cnblogs.com/kousum/p/14396401.html

GitHub 加速计划 / de / devtools
24.6 K
4.14 K
下载
vuejs/devtools: Vue.js 开发者工具,这是一个浏览器插件,可以安装在 Chrome 和 Firefox 等现代浏览器中,用于调试 Vue 应用程序,提供了组件树查看、状态快照、时间旅行等高级调试功能。
最近提交(Master分支:3 个月前 )
79116147 - 4 个月前
f0359002 - 5 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐