如何将项目根目录外的TypeScript公共文件夹纳入构建并配置路径别名

问题说明 #

同一仓库下存在两个TypeScript项目（project1、project2），需共享根目录下的/common文件夹（含辅助类、DB模型），无需将common封装为独立库。使用paths或rootDirs默认配置时，输出根目录会被设为仓库根路径，现要求保持各项目自身为输出根，同时将/common编译到每个项目的根目录下，通过路径别名实现模块导入。

输入目录结构：

/project1/**/*.ts
/project2/**/*.ts
/common/**/*.ts

期望输出结构：

• project1输出：

/project1/**/*.js
/project1/common/**/*.js

• project2输出：

/project2/**/*.js
/project2/common/**/*.js

具体实现步骤 #

1. 为每个项目配置独立的tsconfig.json #

在project1和project2目录下分别创建tsconfig.json，核心配置如下：

project1/tsconfig.json

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "CommonJS",
    "outDir": "./", // 将输出根目录设为当前项目目录
    "rootDir": "../", // 根目录指定为仓库根，确保能包含common和当前项目文件
    "baseUrl": "./",
    "paths": {
      "@common/*": ["common/*"] // 别名映射到输出后的common目录
    },
    "strict": true,
    "declaration": true
  },
  "include": [
    "../common/**/*", // 引入公共目录的所有文件
    "./**/*" // 引入当前项目的所有文件
  ],
  "exclude": [
    "../project2/**/*" // 排除另一个项目的文件，避免编译冗余
  ]
}

project2/tsconfig.json

配置与project1基本一致，仅需修改exclude字段为"../project1/**/*"即可。

2. 代码中使用别名导入公共模块 #

在项目的TypeScript文件中，通过别名@common导入/common下的模块：

// project1/src/index.ts
import { UserModel } from '@common/models/user';
import { formatDate } from '@common/utils/helpers';

3. 编译项目 #

分别进入两个项目目录执行编译命令：

# 编译project1
cd project1 && tsc

# 编译project2
cd project2 && tsc

编译完成后，common目录的代码会被编译到对应项目的common文件夹下，项目自身代码保持原有目录结构输出，完全符合预期的输出格式。

可选优化：批量编译脚本 #

在仓库根目录的package.json中添加编译脚本，实现一键编译两个项目：

{
  "scripts": {
    "build:project1": "cd project1 && tsc",
    "build:project2": "cd project2 && tsc",
    "build:all": "npm run build:project1 && npm run build:project2"
  }
}

执行npm run build:all即可完成两个项目的编译。

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