如何让ESLint正确识别并解析Docusaurus内置模块别名

解决方案 #

方案一：配置ESLint别名解析（完整适配路径校验） #

1. 安装依赖包

npm install eslint-import-resolver-alias --save-dev

2. 修改ESLint配置文件（以.eslintrc.js为例），新增settings字段配置别名映射：

module.exports = {
  // 原有配置保持不变，例如extends、parserOptions、rules等
  settings: {
    'import/resolver': {
      alias: {
        map: [
          ['@theme', './.docusaurus/theme-classic/src/theme'],
          ['@docusaurus', './node_modules/@docusaurus/core/src/client/exports']
        ],
        extensions: ['.js', '.jsx', '.ts', '.tsx']
      }
    }
  }
}

如果路径和你的项目实际结构不匹配，根据你使用的Docusaurus版本调整对应路径即可。

方案二：忽略指定前缀的路径校验（轻量便捷） #

如果不想额外安装依赖，可以直接给import/no-unresolved规则添加忽略前缀，不需要完全禁用该规则：

module.exports = {
  // 原有配置保持不变
  rules: {
    'import/no-unresolved': [
      'error',
      { ignore: ['^@theme/', '^@docusaurus/'] }
    ]
  }
}

该方案只会跳过Docusaurus内置别名的路径校验，其他模块的路径校验逻辑不受影响。

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