如何构建含内部包的TypeScript工作区？解决PNPM Monorepo构建矛盾

核心思路是利用Node.js条件导出，在共享包的package.json中为开发、生产环境分别指定入口文件，配合TypeScript和Turborepo的配置，实现开发时直接加载TS源文件，构建时自动切换到编译后的JS文件，无需手动修改配置。

步骤1：配置共享包的package.json #

假设你的共享包位于packages/shared，先确保构建脚本能将TS代码编译到dist目录：

{
  "name": "@your-workspace/shared",
  "scripts": {
    "build": "tsc"
  },
  // 关键：条件导出配置
  "exports": {
    ".": {
      "development": "./src/index.ts",
      "production": "./dist/index.js",
      "types": "./dist/index.d.ts"
    }
  },
  // 兜底的主入口和类型入口（兼容旧工具）
  "main": "./dist/index.js",
  "types": "./dist/index.d.ts"
}

同时在共享包的tsconfig.json中开启类型声明输出：

{
  "compilerOptions": {
    "outDir": "./dist",
    "declaration": true, // 生成d.ts类型文件
    "declarationMap": true,
    // 其他TS配置...
  },
  "include": ["src/**/*"]
}

步骤2：配置主应用的TypeScript #

主应用的tsconfig.json需要启用Node.js 16+的模块解析策略，才能识别条件导出：

{
  "compilerOptions": {
    "moduleResolution": "node16", // 或 "nodenext"
    "target": "ESNext",
    // 可选：路径别名方便导入
    "paths": {
      "@your-workspace/shared": ["../packages/shared"]
    },
    // 其他TS配置...
  },
  "include": ["src/**/*"]
}

步骤3：配合Turborepo设置环境变量 #

在turbo.json中为开发、构建任务分别设置NODE_ENV，触发对应的导出规则：

{
  "$schema": "https://turbo.build/schema.json",
  "tasks": {
    "dev": {
      "env": ["NODE_ENV=development"],
      "persistent": true,
      "cache": false
    },
    "build": {
      "env": ["NODE_ENV=production"],
      "dependsOn": ["^build"], // 先构建所有依赖的共享包
      "outputs": ["dist/**"]
    }
  }
}

为什么这样可行？ #

• 开发模式下，NODE_ENV=development，主应用会直接加载共享包的src/index.ts，TS实时检查类型，配合热更新工具（如Vite、Webpack），保持流畅的开发体验。
• 构建时，Turborepo会先执行所有共享包的build脚本，生成dist目录下的JS和类型文件；随后主应用构建时，NODE_ENV=production自动切换到dist/index.js，避免导入未编译的TS代码。

额外注意事项 #

• 确保所有依赖的共享包在构建前完成编译，Turborepo的^build依赖规则会自动处理这一点。
• 如果使用Vite等工具，无需额外配置，Vite会自动识别条件导出规则；使用Webpack的话，确保版本为5+（已支持条件导出）。

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