简介
在前端开发中,为了确保代码质量与风格的一致性,我们经常需要使用一些代码规范工具。其中,ESLint 是一款比较流行的 JavaScript 代码检查工具,它可以检查代码风格是否符合指定规范,并提供了一些修复能力。
然而,使用 ESLint 进行代码检查也需要一些配置,在维护和更新时也需要一定的成本。因此,社区中也出现了一些可复用的规则配置,如 eslint-config-airbnb、eslint-config-standard 等,这些配置可以直接在项目中使用,方便了前端开发人员的开发过程。
本文将介绍一个比较小众的 eslint 配置包 eslint-config-unobtrusive,它可以帮助我们维护高质量的代码,降低代码维护成本。
安装
只需要在项目中安装 eslint 和 eslint-config-unobtrusive 两个包即可。
--- ------- ------ ------------------------- ----------
使用
单个项目中使用
在项目根目录下,新建 .eslintrc.js 文件,然后在其中添加如下配置:
-------------- - - -------- -------------- ------ - -- ----- -- --
然后,在项目根目录下运行以下命令即可开始 lint:
-------------------------- - ----- -----------------
在多个项目中使用
如果我们想在多个项目中使用相同的规则配置,我们可以将配置提取到单独的配置项目中,这样我们在多个项目中共享同一个配置项目即可。
首先,我们在根目录下创建一个 lint-config 项目,然后在其根目录下创建 .eslintrc.js 文件,用于存放通用配置。
-------------- - - -------- -------------- ------ - -- ----- -- --
接着,在其他项目中安装 eslint 和 eslint-config-unobtrusive,并在项目根目录下安装它们的依赖:
--- ------- ------ ------------------------- - ------------------- ----------
然后,在项目根目录下新建配置文件 .eslintrc.js,指定 extends 和 rules:
-------------- - - -------- ------------------------------ ------ - -- ----- -- --
这样,在项目中运行 eslint 命令时,将会优先使用项目根目录下的配置文件;如果没找到,则会使用 .eslintrc.js 中指定的配置。
规则
该包默认启用了 airbnb 的常见规则,由于篇幅限制,我们在此不再进行详细说明,请查看链接了解其含义:https://github.com/airbnb/javascript
此外,该包还启用了以下规则:
- 'no-console': 'error'
- 'no-unused-vars': ['error', { 'vars': 'all', 'args': 'none', 'ignoreRestSiblings': false }]
- 'no-restricted-properties': [ 2, { 'object': 'it', 'property': 'only', 'message': 'Do not use mocha-exclusive tests in this project.' } ]
其中:
- 禁用 console
- 禁止未使用变量
- 禁止在 mocha 测试中使用 it.only
这些规则可以帮助我们规范JavaScript代码的风格,避免一些常见的 Bug。
结语
ESLint 的配置十分灵活,可以根据不同的项目、团队或个人喜好来进行定制。本文介绍了一款小众的 eslint 规则配置包,通过使用它我们可以快速地规范我们的前端代码并减少代码维护成本。希望这篇文章对你有所帮助!
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/5eedaf25b5cbfe1ea0610fa4