1. 引言
在前端开发中，代码规范的重要性不言而喻。而 eslint 作为一款强大的 JavaScript 代码检测工具，自然成为了开发者们的首选。但是，当我们在项目中用到了别名映射时，eslint 似乎并不怎么识别。
好在有一个叫做 eslint-import-resolver-alias 的 npm 包可以帮我们解决这个问题。那么本篇文章就来详细介绍一下这个 npm 包的使用教程。
2. 安装
使用 npm 安装该包：
npm install eslint-import-resolver-alias --save-dev
3. 配置
在使用 eslint 的项目中，需要在 eslintrc 配置文件中添加以下代码：
-- -------------------- ---- -------
-
----------- -
------------------ -
-------- -
------ -
---------------- -------------------
--
------------- ------- -------
-
-
-
-其中，@/components 是我们要定义的别名（可以自定义别名），./src/components 是别名对应的真实路径。extensions 列表中指定了我们需要解析的文件类型。
这样，在代码中使用绝对路径时，可以替换为 @/components/XXX，可以直接被识别为相对路径，而无需配置每个文件。
4. 示例
假设我们在 ./src/components 目录下新建了一个 Navbar 组件，可以这样在代码中引用：
import Navbar from '@/components/Navbar'
这样，我们就可以使用自己定义的别名了。
5. 总结
eslint-import-resolver-alias 的使用非常方便，只需要简单的配置即可在 eslint 缺省的规则下使用别名路径。这对项目管理和开发效率都很有帮助。
建议开发者在项目中尽量使用别名路径，方便维护和移植。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/71091