如何协调 monorepo 与多个 tsconfig.json（每个都有自己的路径）？

Question

我们的代码库设置如下：

-A
--utils
---index.ts
--index.ts
--tsconfig.json
-B
--utils
---index.ts
--index.ts
--tsconfig.json
-tsconfig.json

我们的根

tsconfig.json

包含以下内容：

    "paths": {
      "A/*": ["A/*"],
      "B/*": ["B/*"],
    },

每个包裹的

tsconfig.json

包含以下内容：

    "paths": {
      "utils/*": ["./utils/*"],
    },

这适用于我们当前的目的，因为我们目前仅使用 TS 进行类型检查，但实际上我们使用 Babel 生成构建，Babel 在各种

alias

文件的

.babelrc

属性中具有类似的设置。

我们希望开始使用

ts-node

（或等效项）运行代码，但遇到了运行时 TS 不知道如何解析模块的问题。例如：

// A/index.ts
import { someUtil } from 'utils'
export const someFunc() => someUtil();

// B/index.ts
import { someFunc } from 'A';

当我们运行

npx ts-node ./B/index.ts

时，我们收到一条错误消息“找不到模块 'utils'”。

我们知道，我们可以通过将所有内容提升到根目录来实现此功能

tsconfig.json

，但当您已经在包 A 中时，

import { someUtil } from 'A/utils

似乎是多余的。

有没有办法以我们现有的方式使用路径？我们还阅读了一些有关项目参考资料并进行了尝试，但似乎没有取得任何进展。

Answer 1

在每个项目的

tsconfig.json

文件内，您应该在根

extends

上使用

tsconfig

，如下所示：

// A/tsconfig.json
{
 "extends": "../tsconfig.json",
 ...
}

这样所有子项目都会继承其他通用包的路径。

我认为你甚至可以在根上定义

utils

路径，这样你也不必重复。

有关

extends

选项的更多信息请参见此处：

https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#tsconfig-bases

更新

你还需要使用这个库：

https://www.npmjs.com/package/tsconfig-paths

以及您使用的

package.json

属性中

ts-node

脚本中的

scripts

内：

ts-node ... -r tsconfig-paths/register ... index.ts

。

这个库将读取

ts-config.json

中的包并将它们放在

node_modules

中，这样当你使用 Node 或 ts-node 运行时，其他包就可以找到它们。

Answer 2

我希望建议你尝试做的事情可能没有意义，这不是粗鲁或无益的。

从包 A 的角度来看，“./utils”可能与包 B 看到的“./utils”不同 - 因为它们具有不同的文件系统“root”。然而，从两个包的角度来看，尝试将两个不同的“./utils”路径别名为“utils”会产生不可避免的冲突。

我也不确定这样做是否有任何价值。我个人会将文件夹“./utils”的别名删除为顶级别名“utils”，然后我认为您的问题就会消失。也许您在每个包的基础上想要的是特定的

includes

，并且每个包的“本地”实用程序都相对于包进行寻址......

{
  "extends": "../tsconfig.json",
  "include": ["index.ts", "utils/index.ts"]
}

Answer 3

您可以使用bun，bun 开箱即用地支持此功能。使用

bun run A/index.ts

运行将正确导入实用程序。

其他工具，react-native，webpack，vite 等都不支持这一点。