ESLint 是一款开源的 JavaScript 代码检查工具，可以在代码编写时就发现错误、代码风格问题以及一些潜在的问题，让我们的代码更加规范、清晰与可维护。随着前端技术的发展，我们的应用代码量变大，代码质量的管理必须得到更加重视。而 eslint-config-birhoff 是一个优秀的 ESLint 配置规范包，本文将介绍这个包的使用教程。
安装
在项目根目录下通过 npm 命令进行安装：
$ npm i eslint-config-birhoff --save-dev
你需要同时安装 eslint、babel-eslint 和相关的校验规则：
$ npm i eslint babel-eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react --save-dev
配置
在项目根目录下新建 .eslintrc.js 文件：
-- -------------------- ---- -------
-------------- - -
-------- ------------
------ -
-- -------
--
-------- -
-- ------
-
--然后，在 package.json 文件中添加 "eslint": "eslint src" 命令，可以在项目根目录下执行 npm run eslint 进行代码检查。
-- -------------------- ---- -------
-
------- -------------
---------- --------
---------- -
--------- ------- ----
--
------------------ -
--------------- ---------
--------- ----------
----------------------- ----------
------------------------ ---------
----------------------- ----------
------------------------- ---------
---------------------- ---------
-
-规则说明
Base Rules
es6 和 env 规则基本不用配置，因为 eslint-config-birhoff 已经为我们预设好了，这些规则不需要在 .eslintrc.js 中再次声明。
eslint-config-airbnb
eslint-config-airbnb 是 Airbnb 公司开源的 JavaScript Style Guide，大部分前端开发者都用它来管理自己的代码风格。然而，此模板完全按照其推荐规则进行设置，可能会过于苛刻， eslint-config-birhoff 则是在该基础上进行了一些优化，做了以下修改：
-- -------------------- ---- ------- ------------- -- ------------------------------- -- -------------------- -- ------------------------------ -- ------------------------------- -- ------------ -- ----------------------------- -- ------------------------------- -- -------------------------------- -- ------------------------ -- -------------------------- -- ---------------------------------------- -- ------------------------------------------ -- ------------------------- -- -------------------- -
其中 no-console 规则关闭了，因为打印调 console 是非常常见的操作；import/prefer-default-export 也被禁用，因为我们认为它对统一样式并不重要。
eslint-plugin-import
import 和 export 是 es6 语法的一部分，在我们的代码中几乎无法避免。然而，出于某些原因有一些引入问题我们需要注意，eslint-plugin-import 就存在于这个时候。
'import/no-cycle': 2, 'import/no-unresolved': 0, 'import/named': 2
eslint-plugin-jsx-a11y
针对需要考虑辅助设备的用户，我们需要遵循一些标准，在开发过程中要严格遵守。由于 eslint-plugin-jsx-a11y 是最好的解决方案之一，eslint-config-birhoff 所包含的绝大多数规则都来自它。
eslint-plugin-react
React 是前端开发中最受欢迎的 JavaScript 库，所以 eslint-plugin-react 是必不可少的插件之一。
总结
以上就是 eslint-config-birhoff 的使用教程。该 npm 包为我们的代码风格统一管理提供了便利，使我们的代码更加规范与可维护。虽然它的规则配置已经经过优化，但仍然有可能无法满足我们的需求，可以根据自身开发需求酌情进行修改。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055cb481e8991b448da216