ESLint 是一个开源的 JavaScript 代码检查工具，它被广泛用于前端开发中。它可以帮助我们检查代码格式、潜在的错误和不良模式等等。ESLint 中有一个名为 no-restricted-imports 的规则，该规则用于限制特定的导入。在使用 ESLint 进行代码检查时，很容易被该规则卡住，本文将介绍如何规避该规则的限制。
no-restricted-imports 的使用场景
no-restricted-imports 规则用于限制导入某些模块或特定的模块路径匹配模式。如果您想禁止使用某些特定的模块或者只允许使用特定的模块，那么 no-restricted-imports 规则可以派上用场。
下面是 no-restricted-imports 规则的一个示例：
-- -------------------- ---- -------
-- --------------
-
-------- -
------------------------ -
--------
-
-------- -
-
------- ---------
---------- ------- --- ------- - ---- ------------------- ---------
-
-
-
-
-
-上面的规则表示我们禁止在代码中导入名为 jquery 的模块，而应该使用 my-custom-jquery 模块代替。当 ESLint 检测到代码中使用了 jquery 模块时，将会提示警告信息。
规避 no-restricted-imports 的限制
使用 overrides 属性
如果您在某个文件中需要导入被规则限制的模块，您可以使用 ESLint 的 overrides 属性来针对该文件关闭 no-restricted-imports 规则。
-- -------------------- ---- -------
-- --------------
-
-------- -
------------------------ -
--------
-
-------- -
-
------- ---------
---------- ------- --- ------- - ---- ------------------- ---------
-
-
-
-
--
------------ -
-
-------- -----------------------------
-------- -
------------------------ -----
-
-
-
-上面的配置表明，当 ESLint 进行代码检查时，将不检查 path/to/specific/file.js 文件中的 no-restricted-imports 规则，该文件可以自由地使用被规则限制的模块。
使用 alternatives 属性
在 no-restricted-imports 规则中，还可以使用 alternatives 属性来允许您使用指定的导入路径。例如，在我们上面的示例中，为了避免使用被规则限制的 jquery 模块，我们可以使用 alternatives 属性，允许使用 my-custom-jquery 模块代替。
-- -------------------- ---- -------
-- --------------
-
-------- -
------------------------ -
--------
-
-------- -
-
------- ---------
---------- ------- --- ------- - ---- ------------------- ---------
-
-
-
--
---------------------- -
--
----------- -
------------------ -
------- -
------------------ ---------------- -------------------
-
-
--
-可以看到，我们配置了 my-custom-jquery 模块路径，并在 settings 属性的 import/resolver 中使用了该配置。这样，在导入模块时，我们只需要使用类似下面这样的语句：
import $ from 'my-custom-jquery';
这样就可以避免使用被规则限制的 jquery 模块了。
总结
ESLint 是前端开发中的一个重要工具，它可以帮助我们检查代码格式、潜在的错误和不良模式等等。no-restricted-imports 是 ESLint 中的一个限制导入的规则，如果您想禁止使用某些特定的模块或者只允许使用特定的模块，那么可以使用该规则。本文介绍了如何规避 no-restricted-imports 的限制，包括使用 overrides 属性和 alternatives 属性。希望读者在使用 ESLint 进行代码检查时能够更加顺畅。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64631faa968c7c53b042361e