搭建了一个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
  }

好了,保存刷新,你会发现报错不再提示,这样做的好处是,挑选需要忽略的规则

关于vue的语法规则检测报错问题的更多相关文章

  1. vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives

    vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives Vue 2.2.0+的版本里,当在组件 ...

  2. idea使用Vue的v-bind,v-on报错

    参考解决在WebStorm中使用Vue的v-bind,v-on报错 File-->Settings-->Editor-->Inspections-->XML 把 Unbound ...

  3. @vue/cli 3 运行支持报错 socket

    问题 /sockjs-node/info 无限报错 解决方案 原因是相关代理端不支持 ws,因此需要在代理处关闭 ws,即 ws: false,如下: vue.config.js const ds_p ...

  4. vue中更换.ico图标报错路径找不到图片

    问题描述: vue项目中,想要更换.ico图片,更换完成后刷新页面报错,找不到路径. 解决: 更换完图片,重新启动下vue项目(npm run dev)就可以啦~ 哈哈哈 补充知识: 网页title旁 ...

  5. 新建vue项目中遇到的报错信息

    在npm install的时候会报错,经过上网查阅资料之后,解决方法如下: 0.先升级npm版本:npm install -g npm   有可能是npm版本过低报错 1.然后清理缓存: npm ca ...

  6. vue 中安装使用sass 报错遇到的问题整理

    不出错的情况下,正常安装: 1.安装包: npm install node-sass --save-dev npm install sass-loader --save-dev (sass-loade ...

  7. vue使用uglifyjs-webpack-plugin后打包报错

    楼主最新对已做项目进行打包优化,配置了打包环境下去除console.log语句插件---使用uglifyjs-webpack-plugin具体代码如下 npm install uglifyjs-web ...

  8. vue打包后刷新页面报错:Unexpected token <

    前言 今天遇到了一个很怪的问题,在vue-cli+webpack的项目中,刷新特定页面后页面会变空白,报错为index.html文件中Unexpected token <. 怪点一是开发环境没有 ...

  9. 前端vue项目执行npm install 报错cd() never called()

    前端我刚开始接触Vue,从GitHub上下载了代码程序,但缺少一些插件,用vscode打开并下载插件执行报错cd() never called! 解决的方式 1.执行cmd命令行不要再vscode里执 ...

随机推荐

  1. 关于scrapy下载文件重命名的办法以及对应url没有文件后缀的办法

    https://www.jianshu.com/p/d1bb28cbb6a8 scrapy中负责下载文件的是class MyFilesPipeline(FilesPipeline)类 其中负责下载文件 ...

  2. window bat 运行 cmd 命令

    新建一个.bat批处理文件,编写以下切换目录 并且执行 ipconfig 命令: cmd /k "cd /d D:phpStudy/WWW & ipconfig" cmd ...

  3. 判断PC或mobile设备

    js 限制: <script type="text/javascript"> function uaredirect(f){try{if(document.getEle ...

  4. P4219 [BJOI2014]大融合(LCT)

    P4219 [BJOI2014]大融合 对于每个询问$(u,v)$所求的是 ($u$的虚边子树大小+1)*($v$的虚边子树大小+1) 于是我们再开个$si[i]$数组表示$i$的虚边子树大小,维护一 ...

  5. python简说(七)元组,集合

    一.元组 元组也是一个list,但是它的值不能改变 定义元组的时候,只有一个元素,后面得加逗号 oracle_info = (123,) 二.集合 1.集合天生就可以去重,集合是无序的 2.#交集 r ...

  6. Mybatis的in使用

    foreach元素的属性主要有 item,index,collection,open,separator,close.    item表示集合中每一个元素进行迭代时的别名,    index指 定一个 ...

  7. topcoder srm 410 div1

    problem1 link 不包含$gridConnections$ 的联通块一定是连在所有包含$gridConnections$的联通块中最大的那一块上. import java.util.*; i ...

  8. Vim 学习

    主要分为三种模式: 一般模式 编辑模式 命令行模式 光标的移动 单词级 比单纯的逐个字符的移动,效率要高 w or W 向移动到下一单词开头 ★★ b or B 向左移动到单词开头 ★★ 块级 gg文 ...

  9. outlook使用笔记

    使用电子邮件客户端(pc端)软件, 确实是不得已. 出于某些考试/了解的目的? 现在使用 在线/网页端电子邮件 确实要好得多, 方便得多了. outlook和其他软件都是 设置的 "帐户 a ...

  10. oracle单行函数 之 时间函数

    select  systemdate from dual --得到时间 select systemdate+300 from dual  --日期 +数字=日期,表示若干天之后的日期 select s ...