ESLint 你可能不知道的知识点
本文主要介绍所有 ESLint 比较偏的知识点,一些重要配置的含义,如何在 VS Code 中使用 ESLint 插件,以及 ESLint 的常用的标准 recommanded, standard 和 airbnb 的区别。 最重要的是,如何在大团队中统一一套 ESLint 配置。
常用 ESLint 插件的区别等等,代码格式化到底用 prettier 还是 eslint 插件还是 standard 插件?请看本文介绍。
1. sourceType 是什么意思?
sourceType 有两个值,script 和 module。 对于 ES6+ 的语法和用 import / export 的语法必须用 module.
2. eslint --init 只有在选择 "To check syntax, find problems, and enforce code style" 才可以选择 airbnb, standard, recommended 标准。
3. 有时候在前端项目中存在前端和 node 的代码共存的情况,只要在 env 中配置好 browser: true, node: true 就可以把兼容不同环境的全局变量兼容进来,例如 nodejs 中的 global, process 等等。
4. 规则强度是 airbnb > standard > recommended. 看下图,
recommended 和 standard 大概有 88 出不同,主要是 recommended 很多都是 off, standard 是 error, 同时 standard 还有很多特有的规则。
左边是 recommended, 右边是 standard standard 特有的规则5. 关于自动修复
现在代码都比较严格,可能包含缩进是 2 个空格,是否在语句最后加逗号的情况。不可能自己手动去一个个修正。
eslint ./src --fix
加上 --fix 可以自动修正一些明显的问题。
配置 VS Code 自动修复,安装 ESLint VS Code 插件。 View -> Command Palette -> install extension.
首选项 -> 设置 -> 搜索 "autofix". Auto Fix On Save。 就可以在保存的时候自动修正了。
比较推荐还是 ESLint 的插件。 因为 ESLint 毕竟是所有配置的入口和出口,方便配置和禁用配置。有些同学喜欢用 Standard 和 Prettier,还是有局限性。