Vue-Devtool安装，却在chrome开发者工具中找不到？

最新推荐文章于 2024-07-12 22:22:09 发布
最新推荐文章于 2024-07-12 22:22:09 发布
阅读量1.6k 收藏 1
点赞数 1
文章标签： 前端_Vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_38502653/article/details/100731649
版权

在学习Vue上的必经之路，开发者工具的使用，然后半路却被这个问题阻拦了
Vue.js is detected on this page. Devtools inspection is not available because it’s in production mode or explicitly disabled by the author.
在这里插入图片描述
在这里我使用，如果使用压缩版也会出现这个报错
在这里插入图片描述

点击下方链接，下载Vue的开发版本
https://cn.vuejs.org/v2/guide/installation.html

在项目中导入Vue的开发版本
在这里插入图片描述
再次打开项目，按F5刷新，现在Vue的调试面板可以正常显示了
在这里插入图片描述

白日梦codding
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue-devTool编译和安装教程附源代码和编译后的安装包
04-03
在Chrome、Firefox等浏览器上安装Vue DevTools可以极大地提升Vue应用的开发效率。 本教程将详细介绍如何编译和安装Vue DevTools，以及如何使用源代码进行操作。我们将分为以下几个步骤进行： 1. **环境准备** - ...
chrome-vue-devtool.zip
06-07
Vue Devtools 可以在浏览器的开发者工具中作为扩展程序安装。这个压缩包 "chrome-vue-devtool.zip" 提供了适用于Chrome浏览器的Vue Devtools安装包。用户需要完成以下步骤来安装和使用这个工具： 1. 首先，下载 ...
解决Vue.js devtools插件成功装上，却在控制台中找不到的问题
CCCCt1的博客
07-29 8728
在Vue.js devtools这个插件安装成功后是可以在浏览器的右上角可以见到这个图标，如下图所示： 当然，现在我们要解决的是为什么安装好了，在控制台却找不到这个插件： 首先第一种方法是： 修改文件：vue-devtools-master/shells/chrome/manifest.json如下图所示： 如果这个方法不行，就换下一种方法： 第二种方法： 按F5+F...
Vue3开发工具设置好后在开发者工具中找不到“vue”面板？
mx_programmers的博客
03-02 716
chrome。
关于Chrome浏览器vue devtools F12后控制台不显示VUE选项的问题
最新发布
wenbaikaichang的博客
07-12 1091
1.首先找到这个插件安装的位置（我浏览器谷歌为例）：C:\Users\fang\AppData\Local\Google\Chrome\User\Data\Default\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\5.3.4_0，找到并打开manidest.json文件。在安装完Vue.js devtools后，打开自己写的vue网页，发现右上角vue图标虽然亮了，但是通过F12打开控制台也没有Vue这个选项。最后保存，重新Shift+F12就可以了。
chrome 中找不到vue的扩展工具
qq_45970123的博客
08-01 635
vue.jd.devtools无法显示
vue devtools在工作台没有显示的解决方法
ASCE_S的博客
08-01 2682
在谷歌商店下载vue devtools扩展工具，选择开发版本的： 随后，在扩展程序里改下配置： 开启后记得关闭工作台刷新下界面就可以看到： 如果不行的话，看下你下载的vue.js是不是压缩版的，即vue.min.js，换成vue.js就可以了。压缩版的好像不支持debug，没有开发模式。 网上一大堆说要去修改插件里的manifest.json文件里的内容，但是我发现我不改照样可以看到vue选项。 ...
vue-devtools安装后，chrome控制台并没有出现vue扩展工具
palmer_kai的博客
02-15 6439
问题 在使用 vue-cli3.0 开发的时候， 突然发现vue-devtools 扩展工具不能使用， 虽然开发中可以不使用该工具，但是使用该工具确实可以提高开发效率 Vue.js is detected on this page. Devtools inspection is not available because it’s in production mode or explicitly ...
Vue.js devtool插件已经运行，但是调试窗口没有出现的原因
weixin_45785873的博客
11-23 2406
Vue.js devtool插件已经运行，但是调试窗口没有出现的原因 我们可以看到插件运行了，但是在调试器中没有显示 首先我们进入插件安装目录，找到manifest.json文件，修改参数："persistent": false成"persistent": true 然后刷新页面，可以看到运行成功，当然，有注意点： 1、首先是要修改"persistent": true，在vue项目...
disable-devtool:通过f12按钮，右键单击和浏览器菜单禁用Web开发人员工具
04-27
:rocket: 仅一行禁用Web开发人员工具 | 在线试用/文件| 版本日志| 吉蒂 1.快速使用 1.1 npm参考 npm i disable-devtool import disableDevtool from 'disable-devtool' ; disableDevtool ( ) ; 1.2脚本属性配置 &...
vue dev-tools离线安装包 chrome版本 6.6.1
04-13
Vue dev-tools浏览器扩展的下载，安装方式如下： 打开Chrome浏览器–>选择更多工具–>扩展程序–>打开开发者模式,点击“加载已解压的扩展程序” 如果找不到该方式就看下开启开发者模式再试。
vue-devtool6.2.1，vue开发调试工具第六版
08-14
- Chrome和Firefox等浏览器的开发者工具提供了一套丰富的调试接口，使得像Vue DevTools这样的扩展得以实现，帮助开发者深入理解和调试Web应用。 Vue Devtools 6.2.1是Vue.js开发者的重要工具，它不仅简化了调试...
Chrome安装vue-devtools后，控制台没显示
weixin_43442327的博客
11-30 1074
勾上拓展里的这几项，我的控制台就显示了
安装了Vue-devtools插件，浏览器的控制台不显示
qq_31594665的博客
10-19 3919
Google浏览器中开发调试的时候，右上角出现vue的图标，但是在开发者工具中没有出现vue调试（已在扩展程序中安装 Vue Devtools），控制台却没有Vue。没显示调试工具的原因是用了生产环境的版本或是压缩的vue版本，Vue Devtools只在开发环境生效。
vue-devtools调试工具安装
白马非马军的博客
10-08 387
chrome浏览器安装vue-devtools插件 由于vue是数据驱动的，所以这就存在在开发调试中查看DOM结构并不能解析出什么。但是借助vue-devtools插件，我们就可以很容易的对数据结构进行解析和调试 1. 准备：     vue-devtools插件下载地址：https://github.com/vuejs/vue-devtools    我下载的是vue-devtools-...
解决Google浏览器打不开,Vue.js Devtools崩溃问题
weixin_70435769的博客
01-21 1412
原因：由于一开始Google浏览器打不开，在【目标（T）】后加上--test-type --no-sandbox，导致使用浏览器时，稳定性与安全性下降，当你并没有打开Google浏览器，直接在Vscode中使用插件运行Vue并打开实现网页时，就会造成扩展程序的崩溃。回到桌面，右键Google浏览器快捷方式，点开属性，在【目标（T）】后加上--test-type --no-sandbox，记得--test......前面要加上空格。明明有网,但是Google浏览器什么网页都打不开,甚至连设置都打不开。
处理“Vue Devtools在浏览器F12下不显示了”
urnottalent的博客
12-28 5917
处理 “Vue Devtools在浏览器F12下不显示了” 日常分享一句话： 今天这句话来自李宇春《清福》这首歌的一句歌词，“等云舒 等风来 等花慢慢开”，疫情打乱了我们的生活和许多计划，但要相信生活依然很美好，计划也会走上日程。 正文开始！！! 问题 在练习vue框架案例时，要调试一下，于是打开了F12（开发者工具），可是之前能看到的“Vue”调试按钮不见了。 分析 于是我就尝试了各种操作，比如： 把Vue Devtools插件重新启用，不行； 把浏览器也关闭重新打开，还是不行。 再然后，回
解决浏览器中 vue-devtools 不显示的问题
热门推荐
来杯卡布奇诺的博客
08-09 1万+
一种是 vue-devtools 的配置错误，我们需要进入到 vue-devtools 的详情页中，将“允许访问文件网址勾选起来”。vue 项目中浏览器右上角可以显示出插件，但是控制台却没有显示。第三种情况是项目使用了 externals 打包优化。...
vue-devtools无法显示的解决办法
weixin_43866830的博客
08-31 7381
控制台无法显示的解决方法   在安装完vue-devtools，浏览器右上角可以显示出插件，但是控制台却没有显示，这边为大家介绍两个简单粗暴的方法。   一种就是vue-devtools的配置错误，这里我们需要进入到vue-devtools的详情页中，将“允许访问文件网址勾选起来”：   若以上设置了之后还是不可以的话，便在你的代码的入口文件中添加一行以下代码： Vue.config.devtools = true;   到这里控制台就可以正常显示vue的调试工具啦！ ...
google插件vue-devtool 5.00
11-22
vue-devtool是一个用于调试Vue.js应用程序的Google Chrome浏览器插件。它提供了一种简单直观的方式来检查和调试Vue组件以及它们的状态、生命周期钩子等。 使用vue-devtool，开发人员可以轻松地浏览Vue组件层次结构，查看每个组件的属性、状态和计算属性。它还允许开发人员查看组件的生命周期钩子在组件生命周期中的执行情况，有助于问题排查和性能优化。 此外，vue-devtool还提供了一种监视Vue应用程序的状态变化的功能。开发人员可以在状态检查器中实时查看组件和全局状态的变化，特别是在复杂的应用程序中，这对于追踪状态的变化非常有帮助。 除了检查和调试Vue组件，vue-devtool还可以帮助开发人员进行Vue路由的调试。它提供了一个方便的界面来查看当前路由和路由参数，使用vue-devtool可以更轻松地理解和调试Vue路由的行为。 总之，vue-devtool是一个非常有用的工具，它使开发人员能够更加方便地调试和优化Vue.js应用程序。无论是开发一个简单的Vue项目还是一个复杂的应用，使用vue-devtool都能提高开发效率并改善用户体验。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值