前言
在前端开发中，代码质量是非常重要的一方面。而 ESLint 是前端开发中用于保障代码质量的一款静态分析工具。然而，ESLint 的默认规则比较宽松，有些不利于写出高质量的代码。为此，eslint-config-reasonable 应运而生，它是一套严格的规则集合，用于帮助从事前端开发的工程师自动化保障代码质量，更好地组织代码，避免潜在的错误和不佳的编码风格。
本文将介绍如何使用 npm 包 eslint-config-reasonable ，希望对前端开发者有所帮助。
安装
使用 eslint-config-reasonable 前，我们需要在本地安装 Eslint：
npm install eslint --save-dev
然后，再安装 eslint-config-reasonable：
npm install eslint-config-reasonable --save-dev
配置
安装好这两个包后，我们需要在项目根目录下创建一个 .eslintrc.js 文件，在这个文件中，我们需要加入 eslint-config-reasonable 的规则集合：
module.exports = {
"extends": "eslint-config-reasonable"
}这里是可选的配置，您可以通过 --config 参数指定规则集合的路径，或者在 package.json 中定义一个 eslintConfig 配置项：
"eslintConfig": {
"extends": "eslint-config-reasonable"
}这样，我们就成功将 eslint-config-reasonable 集成到了我们的 Eslint 配置中。
使用
使用 eslint-config-reasonable 的方式和 Eslint 本身没有区别。通过使用 Eslint 命令执行检查：
# 使用配置在 .eslintrc.js 中的规则进行代码校验 npx eslint src --ext .js,.jsx,.ts,.tsx
另外，我们在项目里写 jsx 代码时需要加上 react 插件：
npm i eslint-plugin-react -D
然后将规则添加到项目的 .eslintrc.js 文件的 plugins 和 extends 中：
module.exports = {
extends: ['eslint-config-reasonable', 'plugin:react/recommended'],
plugins: ['react'],
rules: {
// 自定义规则
},
};示例代码
对于接口请求，有可能会遇到获取数据失败时需要进行重试的情况。这里的代码是利用 promise 进行封装，实现获取数据的功能，并在请求失败时进行重试：
-- -------------------- ---- -------
-- ---------
---
- -------- -------------
- --------- -------- --- ----
- --------- ------------------------------- ------ ----
- --------- ------- -------- ----- ------- ---
- --------- ------- -------- ----- ------ ----
- --------- ------- -------- ----- ---- ------
- --------- -------- ------- --------- -------- ------- -------------------
--
---
- ----
- ------ --------------- ------ ---
- -------- -------------- -------
--
----- -------- --------------- -
----- ------ - -
------------ -------------- -- --------------
-------- -
--------------- ---------------------------------
--
------- ---
----- ---
--
----- -
------ - ------
------- - ---------------
------ - --------------
---- - ------------
------
- - -------
----- ------- -
------ --- ----- -- ------ --- --------
- - ------- -------- ------ -
- - ------- -------- ----- -------------------- --
----- ----------- - ---
-- ------- -
--- ---- - - -- - - ------------ ---- -
-------------------- -------------------
-
-
----- ------ - ----- -- --- --- ------------------ - --
--- ----
--- ---- - - -- - - ------------------- ---- -
----- ---- - ---------------
----- --------------- - ----------
----- - ------ - - -----
--- -
--- - ----- ----------------- - ------- ---------- -------------- -- -
-- ---------- -
----- --- -----------------------
-
------ ------------
---
------
- ----- ----- -
----- ----------- - --------------- - -- - -------
--------------------------------------------------
-- ------------------ -
----- --- ----------------- -- ------------------- -----------------
-
-- ---------------- -
----------------------
------
-
-
-
------ ----
-
------ - ------- --通过集成 eslint-config-reasonable 规则集合，我们可以让代码实现更加严谨，减少潜在的错误和低质量的代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005595b81e8991b448d6bef