Angular切换至esbuild+Vite后无法解析public_api问题求助

1. 检查第三方包的导出配置 #

打开node_modules/@company/package/package.json，确认是否配置了exports字段。正确的配置需要明确映射./public_api到对应的mjs文件：

"exports": {
  ".": "./esm2022/package.mjs",
  "./public_api": "./esm2022/public_api.mjs"
}

如果包没有exports字段，确保它设置了"type": "module"，这样Node.js和esbuild会将其识别为ES模块，尝试自动补全文件后缀。

2. 配置esbuild自动补全文件后缀 #

在angular.json的build选项中添加esbuildOptions，指定需要自动解析的文件后缀（必须包含.mjs）：

"architect": {
  "build": {
    "builder": "@angular-devkit/build-angular:browser-esbuild",
    "options": {
      "esbuildOptions": {
        "resolveExtensions": [".mjs", ".js", ".ts", ".jsx", ".tsx", ".json"]
      }
    }
  }
}

这会让esbuild在遇到无后缀的导入路径时，自动尝试用这些后缀查找对应文件。

3. 给第三方包打补丁（临时方案） #

如果无法修改第三方包的源码，使用patch-package给包打局部补丁：

• 安装依赖：npm install patch-package --save-dev
• 修改node_modules/@company/package/esm2022/package.mjs中的导入语句为：export * from './public_api.mjs';
• 生成补丁：npx patch-package @company/package
• 后续执行npm install时，补丁会自动应用。

4. 确认TypeScript配置 #

检查项目根目录的tsconfig.json，确保以下配置正确：

"compilerOptions": {
  "module": "ESNext",
  "moduleResolution": "bundler"
}

moduleResolution: "bundler"会让TypeScript遵循esbuild的解析规则，避免类型检查和构建时的解析逻辑不一致。

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