使用Airbnb风格指南、ESLint与Husky时，路径别名引发import/no-unresolved错误导致无法提交代码的求助

我之前也遇到过几乎一模一样的问题——用了babel-plugin-module-resolver做路径别名，Babel转译没问题，但ESLint就是识别不了，导致Husky提交前检查直接失败。核心原因是ESLint的eslint-plugin-import没办法自动同步Babel的别名配置，得手动让它和Babel的解析规则对齐，下面是具体的解决步骤：

第一步：安装必要的解析器依赖 #

首先要装eslint-import-resolver-babel-module，这个包是让eslint-plugin-import能读取Babel模块配置的桥梁：

npm install eslint-import-resolver-babel-module --save-dev
# 或者用yarn
yarn add eslint-import-resolver-babel-module -D

第二步：修正ESLint配置的关键问题 #

你的.eslintrc.js里有两个细节需要调整：

1. requireConfigFile的值应为布尔值
   你当前写的是requireConfigFile: 'false'，这会被ESLint解析为true，反而会因为找不到配置文件报错。改成布尔值false（如果你的Babel配置在项目根目录，也可以直接去掉这个配置，让ESLint自动查找）。

2. 完善import/resolver的配置
   显式指定Babel配置文件路径，并且同步别名规则（虽然理论上它能读取Babel的配置，但显式配置能避免路径匹配问题）。

修改后的.eslintrc.js相关片段：

parserOptions: {
  ecmaVersion: 12,
  sourceType: 'module',
  requireConfigFile: false, // 改为布尔值
  babelOptions: { configFile: './babel.config.js' }, // 确保路径指向你的Babel配置文件，之前的./Backend/babel.config.js如果是正确路径就保留
},
settings: {
  'import/resolver': {
    'babel-module': {
      configFile: './babel.config.js', // 显式关联Babel配置
      alias: { // 同步Babel里的别名规则
        '@modules': './src/modules',
        '@utils': './src/utils',
        '@shared': './src/shared',
        '@config': './src/config',
        '@validations': './src/validations',
        '@controllers': './src/controllers',
        '@models': './src/models',
        '@routes': './src/routes',
      }
    },
  },
},

第三步：验证Babel路径别名的正确性 #

检查你的babel.config.js里的别名路径是相对于项目根目录的——比如'@modules': './src/modules'，如果你的代码实际在Backend/src下，就要改成'./Backend/src/modules'，确保Babel和ESLint解析的路径完全一致。

第四步：测试配置是否生效 #

手动运行ESLint检查一个用了别名的文件，验证错误是否消失：

npx eslint src/modules/your-test-file.js

如果import/no-unresolved错误没了，那Husky的提交前检查应该就能正常通过了。

额外排查点 #

如果还是有问题，可以试试：

• 清除ESLint缓存：npx eslint --cache-clear
• 检查是否有其他ESLint配置文件（比如.eslintrc.json）覆盖了当前配置
• 重启编辑器的ESLint插件，确保加载了新的配置

内容的提问来源于stack exchange，提问作者thatguy