Vue坑点杂谈（三）如何简单粗暴的快速搞定vue-devtools

最新推荐文章于 2024-05-31 18:15:48 发布
最新推荐文章于 2024-05-31 18:15:48 发布
阅读量198 收藏
点赞数
文章标签： chrome javascript 前端 vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ODST_TheSolverO5/article/details/107620161
版权

Vue坑点杂谈（三）如何简单粗暴的快速搞定vue-devtools

一、写在开头
很无奈，不会科学上网，新版 QQ浏览器禁用了vue-devtools，chrome又上不去，搞了一下午，给兄弟们指条明路。

二、解决问题
1.首先下载编译好的devtools文件：
https://pan.baidu.com/s/1qBwgmVcHtx_akZAxRk5tTQ （ODST）
2.解压后打开chrome选择拓展程序，选择加载已解压的拓展程序，选中解压后里面的chrome文件夹即可！
在这里插入图片描述
如图所示就安装成功了！
好了，大概就是这样子了，我是O5，共勉！

帝江学者
关注
vue-DEVTOOLS浏览器直接安装
03-08
vue-DEVTOOLS浏览器直接安装。查看过很多博客大多数都是，要安装Vue-Devtools，在一个github下面用git clone或者手动下载一个叫做vue-devtools-master的文件。然后呢，你就要用npm进行install，然后再npm install build。所以这意味着你又要去找npm来装，你会发现，最简便的方法就是下一个集成的node.js。一番辛苦了之后，你就会发现npm安装好了之后，npm install build又会出现一大串的问题。请问哪有那么多时间去google，baidu这些问题？ 该文件可以直接在google中扩展安装。不用再去npm了。一秒完成
vue-devtools
03-27
使用Vue Devtools时，开发者可以实时观察到数据变化如何影响组件视图，从而快速定位并修复问题。此外，Vue Devtools还支持热重载，当源代码发生变化时，应用会自动刷新，无需手动刷新页面，大大提高了开发效率。 ...
Vue.js Devtools插件（Chrome扩展）出现“Service Worker ”
最新发布
qq_45432996的博客
05-31 832
关于Vue.js Devtools插件F12后没有vue选项的问题
Vue DevTools可使用修正方法
王乐平 技术博客
04-14 1万+
因为工作要求，目前主要在用Vue.js技术栈做开发，调试是必不可少的，这里会用的Vue DevTools的调试工具，问题就出在这里，当用Vue DevTools做调试时，很多时候都不能用，提示没有监测到Vue，这让工作效率瞬间拉低了。修正Vue DevTools好了，开始正题，下面来说一下修正的方法。先从官网把Vue DevTools下载下来（https: //github.com/vuejs/vu
谷歌插件（Chrome扩展） “Service Worker （无效）” 解决方法
qq_17627195的博客
07-23 1万+
基本上检查完上面三个地方，这个问题就可以解决了
安装vue-devtools过程中种种问题
u012881483的博客
12-21 1万+
周五按照网上教程进行按照，报错再百度搜索找方案。之前一直在vue-devtools文件夹中使用git bash进行cnpm install安装不成功，报各种依赖包不支持。报错类似如下： npm WARN .. requires a peer of react@^16.4.0 but none is installed 报错内容过多，需要安装依赖包太多。然后将npm版本号降到6.0.1，报错更多。类似 npm WARN npm npm does not support Node.js v14.16.0
vue-devtools-5.1.1
12-29
这个"vue-devtools-5.1.1"版本是Google开发的Vue DevTools的一个特定版本，主要用于支持Vue.js 2.x的应用。 Vue DevTools 5.1.1 版本主要特性包括： 1. **组件树视图**：展示应用中的所有Vue组件及其层级结构，...
vue-devtools-5.1.1.zip
04-23
在github链接上面直接下载的vue-devtools 不可用，我这里在分支里面下载的，5.1.1版本可用的。 使用方法 切换到根目录 cnpm install，然后 npm run build，再 修改shells\chrome 目录下的manifest.json 里面的 ...
vue-devtools_vue-devtools官网_vuedevtoolschrome_vue-devtools_
10-03
安装Vue Devtools非常简单，只需在Chrome浏览器的扩展程序商店搜索“Vue Devtools”，然后点击添加到浏览器即可。在开发模式下运行Vue应用时，Vue Devtools会自动激活。在生产环境中，为了安全和性能原因，通常不...
vue-devtools v5.1.1
03-06
Vue DevTools 是一个强大的浏览器开发者工具，专为Vue.js应用程序提供，它可以帮助开发者在开发过程中进行实时调试、性能分析以及组件检查。Vue DevTools 版本 v5.1.1 提供了更稳定和优化的开发体验。 Vue DevTools...
编译好的chrome浏览器的vue调试插件
09-27
由于网上的vue-devtools插件编译会出项bg无法加载，这个vue-devtools已经编译好了，只要把他放到chrome插件即可
Vuedevtools5.1.1版2019-8-23最新编译配置好版.rar
08-23
谷歌浏览器，开发者模式打开，点开菜单扩展程序，或者地址栏chrome://extensions/，将解压的chrome文件夹直接拖到浏览器里面，就安装成功了，重启一下，地址栏后面就有vue图标了，调试vue程序的时候，图标会亮。按F12进入开发者调试模式，在调试窗口上选择vue。这个是编译好的包，直接可以用，不需要在github上下载源代码，npm编译，manifest.json也已经改好了，直接使用。Vuedevtools5.1.1版2019-8-23最新编译配置好版。
Vue生产环境打包关闭Devtools工具
LMX的博客
11-24 3183
Vue生产环境打包关闭Devtools工具 const isDebug_mode = !(process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'staging') //关闭开发工具 Vue.config.debug = isDebug_mode Vue.config.devtools = isDebug_mode Vue.config.productionTip = isDebug_mode 如果不是生产或测试环境关闭测试工
Vue的devtools工具打包
LMX的博客
04-12 4420
vuejs/devtools源码打包
Vue 3.0学习笔记之 安装
wm201316的博客
01-28 155
Vue 3.0学习笔记之 安装
vue-devtools简单安装教程
菜菜鸟的博客
05-18 3588
最简单的方法： 直接到Google store下载 你也可以去网上找别人已经编译好的vue-devtools文件 当然你也可以跟我来一步一步编译生成vue-devtools工具 第一步：找到vue-devtools的github项目，并将其clone到本地. vue-devtools git clone https://github.com/vuejs/vue-devtools.git 第二步：安装项目所需要的npm包 npm install //如果太慢的话，可以安装一个cnpm, 然后命令换成
浏览器安装Vue devtools
m0_45219210的博客
03-15 1828
下载地址: https://github.com/vuejs/vue-devtools 建议大家下载v5.1.1，这样中间出现错误比较少 点击下载zip后解压 打开cmd，这里希望大家以管理员的身份打开，防止出现不必要的报错 E: 可以直接切换到自己想要的盘，进入自己解压后的目录 cnpm i 下载依赖,这里也可以使用yarn add或则npm i去下载，但是使用淘宝镜像会比较快。 我这里比较快是因为我已经下载过一遍，我是写博客为了截图重新演示 下载成功后执行那npm...
教你使用Vue.js的DevTools来调试你的vue项目
热门推荐
JEECG官方博客
04-28 2万+
Vue DevTools项目的官方主页位于GitHub上：https：//github.com/vuejs/vue-devtools。你可以找到安装说明，帮助解决一些问题等等。目前该扩展在Chrome和Firefox中得到支持，同样Safari也得到了支持。如果你想从安装扩展开始，请不要忘了重新加载你的网页。 入门 让我从一个超级简单的Vue应用程序开始带大家去熟悉Vue的DevTools。 ...
浏览器上安装 Vue Devtools
爱的叹息的专栏
05-11 864
获取vue devtools扩展文件 Vue Devtools_6.1.4_chrome扩展插件下载_极简插件 (zzzmh.cn)https://chrome.zzzmh.cn/info?token=nhdogjmejiglipccpnnnanhbledajbpd 打开浏览器 例如添加google浏览器 在Chrome的地址栏中，输入以下字符： chrome://extensions/ 运行vue项目后访问浏览器，然后F12，调出控制台就可以看到Vue了 ...
Vue3.0-devtools-6.0.0-beta-7-Crx4Chrome插件安装指南
资源摘要信息:"Vue3.0-devtools-6.0.0-beta-7-Crx4Chrome.zip是一个适用于Chrome浏览器的Vue.js调试工具的压缩包，包含了安装文件Vue3.0-devtools-6.0.0-beta-7-Crx4Chrome.crx。这个调试工具主要服务于Vue.js的3.x...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值