导入package.json无main字段的包时如何避免ESLint import/no-unresolved报错

这个报错是eslint-plugin-import的默认解析逻辑和TypeScript的模块解析逻辑不一致导致的：

• 你遇到的@react-types/shared属于纯类型定义包，本身没有运行时代码，所以package.json没有配置main字段，只提供了types字段指向类型声明文件
• TypeScript编译器原生支持识别package.json中的types字段，所以导入校验可以正常通过
• ESLint的import/no-unresolved规则默认使用Node.js CommonJS解析逻辑，只会查找main字段或者包根目录下的index.js文件，找不到就会抛出解析失败错误

方案1：使用TS兼容的导入解析器（推荐） #

安装eslint-import-resolver-typescript作为ESLint的导入解析器，让ESLint的模块解析逻辑完全对齐TypeScript的规则，从根源解决所有同类解析冲突：

1. 安装开发依赖

npm install eslint-import-resolver-typescript --save-dev
# 用yarn的话执行 yarn add eslint-import-resolver-typescript -D

2. 修改项目ESLint配置文件（比如.eslintrc.js、.eslintrc.json），新增解析器配置：

module.exports = {
  // 原有ESLint配置（parser、extends、rules等）保持不变
  settings: {
    'import/resolver': {
      typescript: {} // 会自动读取项目根目录的tsconfig.json配置
    }
  }
}

配置完成后重新执行ESLint校验即可，所有符合TS解析规则的导入都不会再误报，适合长期维护的项目使用。

方案2：配置规则忽略特定包前缀 #

如果不想额外安装解析器，可以直接给import/no-unresolved规则配置忽略列表，跳过指定前缀的纯类型包校验：

module.exports = {
  rules: {
    'import/no-unresolved': [
      'error',
      {
        ignore: ['^@react-types/'] // 所有@react-types开头的包都会跳过解析校验
      }
    ]
  }
}

该方案比逐个加eslint-disable-next-line注释更易维护，仅适用于已知的纯类型包场景，如果新增其他同类包需要手动更新忽略规则。

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