关于vue的语法规则检测报错问题的解决
搭建了一个vue项目，在配置路有的时候，陆续出现了各种报错其中最多的是一些写法，例如空格，缩进，各种括号，结果我一句一句对照，修改相当之费时间，效率低，一上午，一个路由配置都没写好
主要报错如下：
截取了一段常见报错，选取其中一个：
Expected indentation of 4 spaces but found 1 tab
翻译一下，意思是：预期缩进4个空格，但找到1个选项卡。意思是vue在检测写法规则的时候，只认空格，不认tab的缩进，这时你就要修改的页面内容，把tab换成空格，这样就比较麻烦，然鹅各种查找原因，找到了解决方案，如下：
一，找到目录build下的webpack.base.conf.js文件，把其中的rules里的这一段注销掉：
保存，然后重新npm run dev 一下：
报错虽然不见了，但是这样做的弊端是，强行停止一切检错功能，很多语法错误检测不出，在初期，是不建议这么做的，更加不利于代码的可读行以及规范性。那么就要寻找另一个办法，只是更改一下规则里的配置。
二，这就用到了另一个配置文件：test目录下的.eslintrc.js文件（推荐）
添加你的自定义规则，然后推荐大家熟悉一下ESLint 规则
规则
在配置文件中可以设置一些规则。
规则的错误等级有三种：
- “off” 或者 0：关闭规则。“
- warn” 或者 1：打开规则，并且作为一个警告（不影响exit code）。
- “error” 或者 2：打开规则，并且作为一个错误（exit code将会是1）。
为了让你对规则有个更好的理解，ESLint 对其进行了分门别类。
所有的规则默认都是禁用的。在配置文件中，使用 “extends”: “eslint:recommended” 来启用推荐的规则，报告一些常见的问题，在下文中这些推荐的规则都带有一个标记。
Possible Errors对照着来自定义规则配置
以上面提到的报错为例，是跟空格缩进有关，找到相关规则提示：
然后到rules里，手动添加'no-mixed-spaces-and-tabs'，然后定义为0，关闭规则
// 在这里添加自定义规则
'rules': {
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
// 禁止空格和 tab 的混合缩进
'no-mixed-spaces-and-tabs'：0，
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}
好了，保存刷新，你会发现报错不再提示，这样做的好处是，挑选需要忽略的规则
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了基于Vue3+TypeScript实现鼠标框选功能,文中通过代码示例给大家讲解的非常纤细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下2024-07-07
创建Vue3项目有两种常见的方式,一种是想vue2版本一样使用脚手架工具创建,创建vue3项目的脚手架必须是4版本以上的,另一种方法就是使用vite创建,这篇文章主要给大家介绍了关于如何使用vite创建vue3项目的相关资料,需要的朋友可以参考下2022-11-11
解决vue 使用axios.all()方法发起多个请求控制台报错的问题
这篇文章主要介绍了解决vue 使用axios.all()方法发起多个请求控制台报错的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
给大家详细分析了vue.js之props传递参数的相关知识以及问题解决方法，需要的朋友参考下吧。2017-12-12
这篇文章主要为大家详细介绍了Vue.js组件tab实现选项卡切换的相关资料，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
ElementPlus是一款基于Vue3的UI组件库,提供了丰富的组件和响应式设计,易于使用和主题定制,在Vue3项目中集成ElementPlus,需要通过npm安装并引入组件,主题色可以通过修改样式文件进行全局设置,本文介绍Vue3集成Element-plus快速搭建页面框架,感兴趣的朋友一起看看吧2025-03-03
这篇文章主要介绍了Vue中watch与watchEffect的区别详细解读,watch函数与watchEffect函数都是监听器，在写法和用法上有一定区别，是同一功能的两种不同形态，底层都是一样的,需要的朋友可以参考下2023-11-11
这篇文章主要介绍了vue实现加载页面自动触发函数(及异步获取数据)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-07-07
这篇文章主要介绍 Vue3组件传参的方式,包括父子组件、跨层级组件、兄弟组件的传参,如父子组件通过属性绑定和自定义事件双向传参,跨层级组件可利用 Provide/Inject 机制和 Pinia 状态管理,兄弟组件可通过父组件中转或 mitt 库直接传参,需要的朋友可以参考下2025-01-01
vue 组件之间事件触发($emit)与event Bus($on)的用法说明
这篇文章主要介绍了vue 组件之间事件触发($emit)与event Bus($on)的用法说明，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
最新评论