我的Eslint语法限制问题和解决(整理)

我的Eslint语法限制问题和解决(整理)

1.error Missing space before function parentheses

在.eslintrc.js里在rule下新增加一行：'space-before-function-paren': ['error', 'never']，如下图所示：

在这之后，需要在vue ui下重启serve 或者在根目录命令行下npm run serve才能够生效。
使用VS CODE自带的ts格式化修改配置如下

"vetur.format.defaultFormatter.js": "vscode-typescript",
"javascript.format.insertSpaceBeforeFunctionParenthesis": true

尽管在我修改完.eslintrc.js后已经可以生效。

2.error The template root requires exactly one element

在我直接复制一段Element-UI进入vue模板后出现此问题，查阅了一下原来是vue的模版中只有能一个根节点，所以在<template>中插入第二个元素就会报错，于是往<template></template>里的元素用一个<div></div>包裹起来，问题解决。

<template>
  <dir>
    <el-container>
      <!-- 头部区域 -->
      <el-header>Header</el-header>
      <!-- 页面主题区 -->
      <el-container>
        <el-aside width="200px">Aside</el-aside>
        <!-- 右侧内容主体 -->
        <el-main>Main</el-main>
      </el-container>
    </el-container>
  </dir>
</template>

3.error Unnecessarily quoted property ‘125’ found quote-props

该错误表示：对象字面量中的属性名是否强制双引号
在.eslintrc.js里在rule下新增加一行：'quote-props': [0, 'always'],并重新npm run serve

4.error Newline required at end of file but not found

需要在该页面最后一行加一个回车，及最后一行没有任何字符即可。

5.关闭eslint的方法

在项目根目录下新建一个叫vue.config.js的文件：
文件内容：

module.exports = {
  lintOnSave: false
}