Vue常见报错整理大全(从此报错不害怕)

目录
  • 示例1（文件名/路径发生错误）
  • 示例2（标签不完整）
  • 示例3（error 'xxx' is not defind）
  • 示例4（unknown mutation type: changeA）
  • 示例5（Attribute name cannot contain U+0022 ("), U+0027 ('), and U+003C (<).）
  • 示例6（TypeError:Assignment to constant variable.）
  • 示例7（error 'check' is assigned a value but never used ）
  • 示例8（no-mixed-spaces-tabs）
  • 总结

整理一下Vue中一些常见的报错和bug，以及解决办法

示例1（文件名/路径发生错误）

Compiled with problems:———编译问题：

 ERROR in ./src/router/index.ts 10:19-57

错误发生在 ./src/router/index.ts 第10行第19个字符到57字符

Module not found: Error: Can't resolve '../views/admin/AdminVeiw.vue' in 'C:\myel\src\router'

模块找不的 不能resolve（兑现，发现，解决）../views/admin/AdminVeiw.vue

在C:\myel\src\router

示例2（标签不完整）

 ERROR in ./src/views/HomeView.vue

错误发生在HomeView.vue

VueCompilerError: Element is missing end tag.

标签没有结束标签

当看到这个报错，不要慌，你只是缺少了结束标签，把它补充上就好了

示例3（error 'xxx' is not defind）

C:\youmi\src\views\AboutView.vue

出错的文件路径

16:17 error 'reactive' is not defined no-undef

第16行17字符错误 reactive 没有定义

示例4（unknown mutation type: changeA）

[vuex] unknown mutation type: changeA

vuex 找不到一个叫changeA的mutations

示例5（Attribute name cannot contain U+0022 ("), U+0027 ('), and U+003C (<).）

ERROR in ./src/views/AboutView.vue

在AboutView发生错误

VueCompilerError: Attribute name cannot contain U+0022 ("), U+0027 ('), and U+003C (<).

编译错误：属性name 不能不包含 （“），（‘）（<）

示例6（TypeError:Assignment to constant variable.）

const 不能重复赋值

示例7（error 'check' is assigned a value but never used ）

error 'check' is assigned a value but never used no-unused-vars

'check' 被定义但没有被调用

示例8（no-mixed-spaces-tabs）

Compiled with problems:

编译问题

C:\myel\src\views\HomeView.vue

错误出现文件

3:1 error Mixed spaces and tabs no-mixed-spaces-and-tabs

4:1 error Mixed spaces and tabs no-mixed-spaces-and-tabs

第3行的第一个字符

第4函的第一个字符

Mixed spaces and tabs

错误原因：混合的空格与tab

no-mixed-spaces-and-tabs

错误规则： no-mixed-spaces-and-tabs 不准混空格与tab

总结

到此这篇关于Vue常见报错整理的文章就介绍到这了,更多相关Vue常见报错内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • Vuex unknown action type报错问题及解决

    目录 Vuex unknown action type报错 vuex unknown action type:*** 总结 Vuex unknown action type报错 在项目中使用到vuex,因为都是用的模块开发,目录如下 模块代码 原来使用代码 各种查找问题都不好使,完了再方法之前加上模块名称就ok了 vuex unknown action type:*** vuex 分模块后使用mapActions调用action老是提示 [vuex] unknown action type:**

  • 浅谈Vuex注入Vue生命周期的过程

    这篇文章是[前端词典]系列文章的第 13 篇文章,接下的 9 篇我会围绕着 Vue 展开,希望这 9 篇文章可以使大家加深对 Vue 的了解.当然这些文章的前提是默认你对 Vue 有一定的基础.如果一点基础都没有,建议先看官方文档. 第一篇文章我会结合 Vue 和 Vuex 的部分源码,来说明 Vuex 注入 Vue 生命周期的过程. 说到源码,其实没有想象的那么难.也和我们平时写业务代码差不多,都是方法的调用.但是源码的调用树会复杂很多. 为何使用 Vuex 使用 Vue 我们就不可避免的会遇

  • 在使用vuex的时候出现commit未定义错误的解决

    目录 使用vuex的时候出现commit未定义错误 出现的原因 错误展现过程 vuex模块化 commit()时报错 unknown mutation type:xxx 废话不多说直接上问题 总结 使用vuex的时候出现commit未定义错误 出现的原因 书写错误 当然,这个错误不是你单词书写错误 只要的原因是因为你的这个 方法里面没有 commit 这个方法 为什么没有?其实它是有的,只不过在 context 里面 你可能是直接写 commit(xxx)了 错误展现过程 首先我们先调用一下 <

  • Vue常见报错整理大全(从此报错不害怕)

    目录 示例1(文件名/路径发生错误) 示例2(标签不完整) 示例3(error 'xxx' is not defind) 示例4(unknown mutation type: changeA) 示例5(Attribute name cannot contain U+0022 ("), U+0027 ('), and U+003C (<).) 示例6(TypeError:Assignment to constant variable.) 示例7(error 'check' is assign

  • 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 v-for 遍历循环时key值报错的问题

    一 .问题如下: [Vue warn] Avoid using non-primitive value as key, use string/number value instead. non-primitive表示的是对象 这里的[Vue warn]是指不要用对象或是数组作为key,用string或number作为key. :key相当于是索引的作用,提高循环性能,如果循环量较小,不写也可以的. 以上这篇解决vue v-for 遍历循环时key值报错的问题就是小编分享给大家的全部内容了,希望能

  • Vue常见面试题整理【值得收藏】

    看看面试题,只是为了查漏补缺,看看自己那些方面还不懂.切记不要以为背了面试题,就万事大吉了,最好是理解背后的原理,这样面试的时候才能侃侃而谈.不然,稍微有水平的面试官一看就能看出,是否有真才实学还是刚好背中了这道面试题.(都是一些基础的vue面试题,大神不用浪费时间往下看) 一.对于MVVM的理解? MVVM是Model-View-ViewModel的缩写. Model :代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑. View :代表UI组件,它负责将数据模型转化成UI展现出

  • 在vue中解决提示警告 for循环报错的方法

    警告 1.出现这个警告问题的时候 我们可以去main.js中在头部添加这句话: Vue.config.productionTip = false 这样即可去除警告! 2.在build文件下的webpack.base.conf.js文件中, 将 ...(config.dev.useEslint ? [createLintingRule()] : []),注释掉, const createLintingRule = () => ({ test: /\.(js|vue)$/, loader: 'esl

  • vue使用prop可以渲染但是打印台报错的解决方式

    vue属性传递时有时会报下述错误 vue.esm.js?f959:610 [Vue warn]: Error in render: "TypeError: Cannot read property 'RegistrationAuthority' of undefined" found in ---> <DialogHistory> at src/components/tools/dialog_history.vue <NurseInfor> at src/

  • vue 解决setTimeOut和setInterval函数无效报错的问题

    1.在vue项目中的js代码语法与之前使用js和jquery还是有所出入的,现遇到一个点击按钮出现倒计时30S的效果 相信大家对着两个函数都陌生,就是一个定时器,setTimeOut只执行一次,而setInterval会重复执行 需要注意的是:在setInterval不用的时候一定要用clearSetInterval关闭定时器. 2.按照最原始的倒计时效果,实现如下: //获取30s 控制操作倒计时 time(){ if(this.timeWait <= 0){ this.timeWait =

  • vue打包npm run build时候界面报错的解决

    用coding-pages打开后显示Failed to load resource: the server responded with a status of 404 (Not Found), 解决方案: 方案一: 找到config里的index.js,打开修改assetsPublicPath 为"./" 方案二: 或者把index.html文件中的路径/去掉: 下面是去掉后的,可以参考下 成功了! 补充知识:启动vue项目 npm run dev 时报errno -4058 进入到

  • Vue使用Echarts图表多次初始化报错问题的解决方法

    Vue使用Echarts图表多次初始化报错问题的解决方法

    目录 问题 方法一 销毁实例 方法二 不要频繁创建实例 总结 问题 Vue项目中需要用Echarts的柱状图显示数据,并且每次搜索要更新柱状图. 这时候小编发现在控制台会出现这样的报错: 原来的代码是这样的,页面挂载和搜索时都会调用init方法 initChart (dataSet = [5, 20, 36, 10, 10, 20]) { this.barChart = echarts.init(this.$refs.chartBox) const option = { title: { tex

  • vue踩坑记之npm install报错问题解决总结

    vue踩坑记之npm install报错问题解决总结

    目录 前言 常见的有以下多种情况 总结 前言 很多时候安装npm install 的时候并不能直接将当前的node_modules直接一键安装到本地. 总是会出现各种各样的报错 常见的有以下多种情况 tip1:本地node 跟npm 版本不匹配,项目创建者当时的版本为14 ,而新开发者本地node默认为最新需要重新降低版本,使用cmd打开查看本地node和npm版本,询问一下同事的版本,直接去node官网重新 下载安装新的node安装包即可,或者如果本地有多个新老项目为了方便的管理各个node的

随机推荐