vue.js出现Vue.js not detected错误的解决方案

目录
  • vue.js出现Vue.js not detected
  • Vue.js not detected？与众不同的解决方案

vue.js出现Vue.js not detected

第一：在拓展应用的文件夹中找到文件manifest.json，打开并将此处的false改成true。

第二：在vuejs devtool拓展程序的详情页中开启以下两个选项

如果你看到这，恭喜你，看到全网解决这个问题的方法！！！！

以上都是网上有的，但是会有一个小坑，

让很多人。。。。痛。。。。不。。。。欲。。。。生！

看第三步打脸教程

第三：这一步初学者特别容易搞错，开启vuejs devtools程序之后，点击图标还是无法点亮图标。主要的原因是vuejs devtool必须要监视到页面是一个vue项目才能进行调试。

创建一个vue程序，运行，按f12进入调试模式，这时候会发现有一个vue的选项

这时候就会自动开启vuejs devtool工具了。（因为监视到这个应用是vue应用，自然可以用啦！特别注意，如果页面不是vue程序，vuejs devtool是不可以直接用的，就算按f12进入开发者工具也是不会有vue这个选项的「自己踩的坑，自己来填」）

Vue.js not detected？与众不同的解决方案

今天在安装完Vue.js devtools后，打开自己写的一个vue.js网页，发现这个图标并没有亮起来，还是灰色，点击图标显示Vue.js not detected，打开控制台也没有发现有vue的选项

我们先看看Vue.js devtools是否生效，打开Bilibili（，B站是用的vue），你就可以发现这个图标变绿了，说明Vue.js devtools是能用的。

为什么人家的可以你就不行呢，试过一次发现，如果直接在浏览器打开一个html文件（用vue开发的），这个图标就没亮，直到我运行了项目，访问了localhost，他才凉了，而且所有的功能都可以正常使用（手动滑稽）。

至于修改配置文件balabala。。。我都修改了，结果一个没成。

以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • Vue.js devtool插件安装后无法使用的解决办法

    Vue.js devtool插件安装后无法使用的解决办法

    初次使用Vue.js devtool插件的新人在安装了Vue.js devtool插件后,都会经常有一个疑问.我在chrome浏览器里面已经成功安装好Vue.js devtool插件,怎么点击后提示vue.js not detected,无法正常使用呢?对于这样的问题,新人可能会花费很多时间去找答案,今天我们就来整理了解决方法,希望对大家有帮助. 首先,我们先要确保Vue.js devtool插件已经安装成功了.具体的Vue.js devtool插件的安装方法可以:chrome插件CRX的离线安

  • Vue常见报错以及解决方案实例总结

    Vue常见报错以及解决方案实例总结

    目录 前言 一.报错结构 二.常见问题总结及解决方法 Mixed spaces and tabs Element is missing end tag TypeError: Cannot read properties of undefined (reading '...') TypeError: ...forEach is not a function '...' is not defined / no-undef 总结 前言 写代码的过程中一定会遇到报错,遇到报错不要担心,认真分析就可以解决

  • vue项目中常见问题及解决方案(推荐)

    webpack项目中自动引入全局scss变量文件 假设我们有一个公共的scss变量文件variables.scss /*存放所有全局变量*/ $card-title:#C7D200; //首页 卡片标题颜色 $bc-color:#182037; $hoverColor: #7abef9; //链接hover颜色 $fontColor: #E6EFFF; //字体颜色-白色 webpack要识别scss,需要先安装sass的loader npm install --save-dev sass-lo

  • 详解Vue中使用v-for语句抛出错误的解决方案

    Vue 中使用v-for语句抛出错误的解决方案 今天在维护以前的项目的时候遇见了下面的报错情况,开始我以为是因为jQuery和Vue冲突了,所以把以前的jQuery改了,但是还是出现同样的错误-通过查阅资料,发现是因为循环的变量里面的值重复了,导致Vue报错. 复制代码 代码如下: Uncaught (in promise) TypeError: Cannot read property 'removeChild' of null 接下来查了一下解决方案,发现在Vue 2.0之前的版本可以通过在

  • vue.js出现Vue.js not detected错误的解决方案

    目录 vue.js出现Vue.js not detected Vue.js not detected?与众不同的解决方案 vue.js出现Vue.js not detected 第一:在拓展应用的文件夹中找到文件manifest.json,打开并将此处的false改成true. 第二:在vuejs devtool拓展程序的详情页中开启以下两个选项 如果你看到这,恭喜你,看到全网解决这个问题的方法!!!! 以上都是网上有的,但是会有一个小坑, 让很多人....痛....不....欲....生! 看

  • vue新手入门出现function () { [native code] }错误的解决方案

    vue新手入门出现function () { [native code] }错误的解决方案

    目录 出现function () { [native code] }错误的解决 vue使用过程中遇到的bug及解决 1.用event.target操作当前元素出现bug 2.data数据更新之后渲染页面是异步的 3.v-cloak解决网络不好时页面显示双花括号{{}}问题 4.v-pre跳过组件和子组件的编译过程 5.element的navMenu导航菜单的index不能用数字 6.vue中main.js一引入sass文件就报错 7.所有的v-if最好都加上key 出现function () {

  • Vue.js绑定HTML class数组语法错误的原因分析

    Vue.js绑定HTML class数组语法错误,详情如下所示: 昨天在官网教程上发现一个错误是这样的,下面看图 http://cn.vuejs.org/guide/class-and-style.html 当有多个条件class时这样写有些繁琐.在1.0.19+中,可以在数组语法中使用对象语法: 如果这样写是可以执行成功的,但有错误 data: { classA: 'class-a', classB: 'class-b', classC: 'class-c', isB: true, isC:

  • Vue.js 中 axios 跨域访问错误问题及解决方法

    1.假如访问的接口地址为 http://www.test.com/apis/index.php  (php api 接口) 2.而开发地址为http://127.0.0.1:8080,当axios发起请求时,出现如下错误: Failed to load http://www.test.com/apis/index.php?&act=login: The value of the 'Access-Control-Allow-Origin' headerin the response must no

  • @vue/cli4升级@vue/cli5 node.js polyfills错误的解决方式

    @vue/cli4升级@vue/cli5 node.js polyfills错误的解决方式

    目录 一.错误描述 二.错误日志 1.日志内容: 2.错误原因 3.解决方法[可以使用的方法] 4.解决办法[存在问题,需要研究还] 总结 一.错误描述 因前端项目做的少,今天用 vue脚手架创建项目选择了 @vue/cli 5.0 版本,在编译项目时出现如下错误: 二.错误日志 1.日志内容: 错误1: error  in ./node_modules/jwa/index.js Module not found: Error: Can't resolve 'crypto' in 'H:\iWo

  • 基于cropper.js封装vue实现在线图片裁剪组件功能

    基于cropper.js封装vue实现在线图片裁剪组件功能

    效果图如下所示, github:demo下载 cropper.js github:cropper.js 官网(demo) cropper.js 安装 npm或bower安装 npm install cropper # or bower install cropper clone下载:下载地址 git clone https://github.com/fengyuanchen/cropper.git 引用cropper.js 主要引用cropper.js跟cropper.css两个文件 <scri

  • vue项目实现减少app.js和vender.js的体积操作

    配置webpack中externals来减少打包后vendor.js的体积 在日常的项目开发中,我们会用到各种第三方库来提高效率,但随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差.为此我们需要减少vendor.js的体积,从本质上来解决这种问题. webpack的外部扩展(externals)可以有效的解决. externals 配置选项提供了「从输出的 bundle 中排除依赖」的方法.相反,所创建的 bundle 依赖于那些存在于用户环境(c

  • 详细对比Ember.js和Vue.js

    详细对比Ember.js和Vue.js

    目录 概述 为什么要选择框架? Vue.js Ember.js Ember.js Vue.js对比 总结 概述 JavaScript最初是为Web应用程序创建的.但是随着前端技术的发展,大多数开发人员更喜欢使用基于JavaScript的框架.它简化了你的代码以及使你能完成更多全栈工作,您几乎可以在任何框架中使用JavaScript. 使用什么类型的框架决定了创建应用程序的便捷程度.因此,您必须慎重选择.在已经足够复杂的前端环境里,其中两个框架脱颖而出.我们会在本文中对Ember.js和Vue.j

  • 关于vue中使用three.js报错的解决方法

    关于vue中使用three.js报错的解决方法

    目录 前言 1.vue的问题? 2.Proxy的异常情况 3.Three.js的问题 4.defineProperty异常情况 5.解决 总结 前言 最近在学习three.js,同时也学习一下vue3,然后就出现问题了,报错直接用不了,错误信息如下: Uncaught TypeError: 'get' on proxy: property 'modelViewMatrix' is a read-only and non-configurable data property on the prox

随机推荐