Eslint报错解决合集

た入场券 2024-04-17 13:53 94阅读 0赞

## Eslint报错解决合集 ##

### 前言： ###

最近公司来了很多新的小伙伴，为了解决代码混乱的问题，特地了解了eslint这个神器。

花了大概一周，彻底把代码规范过了一遍。得到的大致思路如下。

**配齐工具：** eslint+prettier+vscode，如果有其他格式化插件，最好卸载禁用。不包括（Vetur），这是为了开发时候可以快速格式化。

**定义规则：** 在VUE项目的根目录，新建.eslintrc和.prettierrc文件（无后缀），这是为了让规则可定义，更贴合自己公司内的开发习惯；

**配置命令（拓展）:** 在package.json中配置格式化检测和修复的命令，这是为让开发者更方便检测自己的代码是否符合规范。

本文档根据公司的开发情况不定期进行更新，遇到问题就会添加上去，就酱。

### 参考文档： ###

[eslintVue文档（使用谷歌翻译即可）][eslintVue]

[VS Code书写vue项目配置 eslint+prettier 统一代码风格][VS Code_vue_ eslint_prettier]

[使用 Eslint + Prettier + husky + lint-staged 提高前端项目质量、统一项目代码风格][Eslint _ Prettier _ husky _ lint-staged]

### 报错整理： ###

1， [Prop "test" should define at least its type vue/require-prop-types][Prop _test_ should define at least its type vue_require-prop-types]

表名需要将test设定一个默认值；

假设test为对象，则设定

props: {
        test: {
          type: Object,
          default: () => {
            return {
              id: ''
            };
          }
        }
      },
    复制代码

假定为数组，则设定

messageList: {
          type: Array,
          default: []
        }
    复制代码

[2，Strings must use singlequote quotes][2_Strings must use singlequote quotes]

表示变量使用了双引号，把表示变量的双引号改为单引号即可。

错误格式：

data() {
        return {
          activeId: ""
        };
      },
    复制代码

正确格式：

data() {
        return {
          activeId: ''
        };
      },
    复制代码

3,Expected to be enclosed by double quotes (vue/html-quotes)

这个报错代表让你要将单引号改为双引号，比如：

错误格式：

<li v-for="(item,index) in flowContent" :key='index'>
          <rightFlow :flowContent="item"></rightFlow>
      </li>
    复制代码

正确格式：

<li v-for="(item,index) in flowContent" :key="index">
          <rightFlow :flowContent="item"></rightFlow>
      </li>
    复制代码

4，[Trailing spaces not allowed no-trailing-spaces][]

代表有的地方空格多余，比如标签结尾处，只要删除多余空格即可

错误格式：

<div class="title-button" ></div>
    复制代码

正确格式：

<div class="title-button"></div>
    复制代码

转载于:https://juejin.im/post/5d4176336fb9a06ad3470859

[eslintVue]: https://link.juejin.im?target=https%3A%2F%2Feslint.vuejs.org%2F
[VS Code_vue_ eslint_prettier]: https://juejin.im/post/5be5429de51d4511a808f4ac
[Eslint _ Prettier _ husky _ lint-staged]: https://juejin.im/post/5d2b49406fb9a07ed13703fa
[Prop _test_ should define at least its type vue_require-prop-types]: https://link.juejin.im?target=https%3A%2F%2Fwww.2cto.com%2Fkf%2F201802%2F722755.html
[2_Strings must use singlequote quotes]: https://link.juejin.im?target=https%3A%2F%2Fwww.jianshu.com%2Fp%2Ff9053c85aa42
[Trailing spaces not allowed no-trailing-spaces]: https://link.juejin.im?target=https%3A%2F%2Fwww.cnblogs.com%2Flittletreeshang%2Fp%2F9264005.html