Vue.js is detected on this page 问题处理

最新推荐文章于 2024-01-05 11:09:27 发布
最新推荐文章于 2024-01-05 11:09:27 发布
阅读量9.2k 收藏 2
点赞数 3
分类专栏： 安装设置 软件使用
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kangguang/article/details/104852191
版权

在Mac上安装完Vue.js devtools插件后，并没有出现Vue选项

点击右上角对Vue插件按钮，会出现 

Vue.js is detected on this page.
Open DevTools and look for the Vue panel.

其实，这已经没有什么错误了，可以正常使用，只是选项没有加载上来。

解决办法：

1.确定 这两项已经选上

2.把调试页面关闭掉，重新打开

3.再次点击右上角插件按钮，会提示重新加载，点击后，页面就出现了

 

备注：

1.关于 修改 vue-devtools-master/shells/chrome/manifest.json文件，是把插件下载后，手动添加上去对，直接通过谷歌商店安装是 没有这个文件的。

2.如果是非Mac系统 可参照这个地址进行设置

   https://segmentfault.com/q/1010000008735643

 

清雨未尽时
关注
  • 3
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
专栏目录
Vue.js devtools-chrome插件-检测网站是否使用vue.js
08-30
网站vue.js检测插件,判断网页是否使用vue.js或者Nuxt.js，Nuxt.js + Vue.js is detected on this page.
vue.global.js，Vue.js 框架的核心文件之一
08-11
`vue.global.js` 文件是 Vue.js 框架的核心文件之一。它包含了 Vue.js 全局对象的定义和一些全局方法和属性的实现。 该文件对整个 Vue.js 应用的运行起着重要的作用，它提供了全局范围的 Vue 构造函数和一些全局方法。例如，你可以使用这个文件来创建全局的 Vue 实例，定义全局组件，添加全局指令，以及访问全局的 mixin、过滤器、插件等。 具体来说，`vue.global.js` 文件定义了以下内容： 1. `Vue` 对象：全局范围的 Vue 构造函数，用于创建 Vue 实例。 2. 全局方法：如 `Vue.createApp`、`Vue.component`、`Vue.directive` 等，用于定义组件、指令等全局内容。 3. 全局属性：如 `Vue.config` 用于配置全局行为，`Vue.version` 用于获取 Vue 的版本号。 4. 全局混入：使用 `Vue.mixin` 可以在所有组件中混入指定的选项。 5. 全局过滤器：使用 `Vue.filter` 可以定义全局过滤器。 6. 全局插件：使用 `Vue.use` 可以注册
谷歌浏览器使用vue.js devtools所遇到的问题
weixin_39893889的博客
11-07 2796
谷歌浏览器使用vue.js devtools所遇到的问题 问题一：安装插件之后打开vue编码的页面发现vue devtools不可用并出现以下错误提示 Vue.js not detected 解决方法 1，打开Bilibili，（B站是使用vue开发的），如果此时图标变绿说明vue.js devtools此插件是可用的。 2，在扩展程序管理中选中vue dextools插件点击详情信息进入修改如...
【插件工具】Vue.js is detected on this page. Open DevTools and look for the Vue panel报错及安装vue-detools
Umbrella_Um的博客
08-06 1万+
如果已经安装了vue-devtools可以不看这部分 先介绍三种安装vue-devtools的方法： ① 可以直接去chrome商店下载该插件（科学上网） ② 事实上并不是都可以科学上网的，所以又不想找梯子，也不想npm install的，这里就给你们准备了大礼 -------------------------------------------------5.1.0--------------...
Vue.js is detected on this page. Open DevTools and look for the Vue panel.
感恩、奋进、自信
06-07 2万+
要解决 这个问题，则是因为没有开启debug  mode，所以要对vue开启debug  mode在main.js中书写下面形式：import Vue from 'vue' Vue.config.devtools = true则可以在浏览器调试vue代码...
Vue js Devtools 无法使用解决办法
最新发布
汪汪汪汪
01-05 1787
错误提示: 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 devtools时，无法启动解决办法；
Vue.js is detected on this page解决方法
热门推荐
码出精彩
03-07 3万+
Vue.js is detected on this page解决方法 最近在学习Vue，所以打算安装一个插件Vue.js devtools 5.3.3。下载完成后，发现用不了，出现了*Vue.js is detected on this page. Devtools inspection is not available because it’s in production mode or ex...
Vue.js is detected on this page. Open DevTools and look for the Vue panel. 解决方法
weixin_45467273的博客
06-09 2万+
安装 Vue Devtools 之后运行总是提示 Vue.js is detected on this page. Open DevTools and look for the Vue panel. ** 安装完成后,必须进入chrome扩展工具选项里,找到 vue-devtools 详情信息，把允许访问文件网址选项 勾选上 然后使用F12来打开开发工具栏,就能看到 vue-devtools的了 如果觉得不错，用你发财的小手点个赞哦~ ...
VUE.JS IS DETECTED ON THIS PAGE. OPEN DEVTOOLS AND LOOK FOR THE VUE PANEL.
qq_45055165的博客
08-08 2447
这个问题，是因为没有在MAIN.JS中开启DEBUG MODE！！我们在MAIN.JS中开启就OK啦。 解决办法： main.js Vue.config.devtools = true 重新启动项目，就可以成功调试啦！
Vue开发者工具
weixin_45115479的博客
03-09 1万+
此篇文章帮助我记录，自己新手在使用Vue开发者工具遇到的问题 问题的大前提，要检查有无安装好Vue开发者工具 1、安装了 Vue.js devtools，也就是Vue开发者工具（Vue官网有详细介绍） https://cn.vuejs.org/ 2、在浏览器中安装，在扩展程序管理中添加 3、启动 Vue.js devetools 4、最重要一步！开启允许访问文件网址 5、基本能够在控制台中看到，并使用Vue开发者工具了 6、我会将Vue开发者工具固定在浏览器上，这样页面中使用了Vue，图标就变绿色，
Vue.js is detected on this page的解决方法
ZipYourFile的博客
05-29 2958
解决谷歌chrome浏览器插件Vue devtools图标变灰，无法开启调试工具的问题。
vue.js和vue.min.js
06-13
vue.js和vue.min.js
解决vue.js this.$router.push无效的问题
10-18
今天小编就为大家分享一篇解决vue.js this.$router.push无效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue devtools chrome扩展离线下载
08-24
vue devtools chrome扩展离线下载
vue-devtools谷歌浏览器插件
09-20
vue-devtools专门用来调试vue If the page uses a production/minified build of Vue.js, devtools inspection is disabled by default so the Vue pane won't show up. To make it work for pages opened via file:// protocol, you need to check "Allow access to file URLs" for this extension in Chrome's extension management panel.
v2.6.10-vue.js&vue.min.js&vue.common.js&vue.runtime.js等14个资源
03-12
内容：vue.js、vue.min.js、vue.common.js、vue.common.dev.js、vue.common.prod.js、vue.esm.browser.js、vue.esm.browser.min.js、vue.runtime.js、vue.runtime.min.js、vue.runtime.esm.js、vue.runtime.common....
使用Vue DevTools 插件报错的问题：Vue.js is detected on this page. Open DevTools and look for the Vue panel.
提莫拌一团蘑菇
03-31 6907
这个问题，是因为没有在main.js中开启debug mode main.js import Vue from 'vue' Vue.config.devtools = true 重新启动项目，就可以成功调试啦！
Vue插件报错：Vue.js is detected on this page.
小小张自由—>张有博
06-30 1万+
下载Vue插件 解决：Vue.js not detected 解决：Vue.js is detected on this page.
关于控制台没有VUE选项
qq_50730710的博客
03-25 554
然而下面没有vue这个选项，那么需要在js代码中添加 Vue.config.devtools = true;当上面图标亮起时，点击图标显示。
Vue.js is detected on this page. Devtools inspection is not available because it's in production mode or explicitly disabled by the author.
09-16
这个问题是由于Vue.js devtools在生产模式下或作者明确禁用时无法使用。为了解决这个问题，你可以按照以下步骤操作： 1. 点击浏览器右上角的三个点，选择"更多工具"→"扩展程序"。 2. 在扩展程序页面中，找到"Vue.js devtools"并点击"详情"。 3. 在详情页面中，将"允许此扩展程序读取和更改您在所访问的网站上留存的所有数据"改为"在所有网站上"。 4. 将"允许访问文件网址"改为打开状态。 5. 在浏览器地址栏中输入"chrome://version/"，复制个人资料路径。 6. 打开文件资源管理器，粘贴个人资料路径，然后进入"\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\6.1.4_0"路径。 7. 找到并打开"manifest.json"文件，将"persistent"的值从"false"修改为"true"。 8. 关闭浏览器的所有窗口，然后重新打开浏览器。 9. 现在你应该会发现Vue devtools扩展的图标变为绿色，同时按下F12键后，你也能够看到VUE调试界面了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值