自动从 Turborepo 中的其他工作区转译 TypeScript 包

Question

我有一个基于 Turborepo 的 monorepo，其中有一个主 TypeScript 应用程序（称为@myscope/tsapp），它使用同一存储库中的另一个 TypeScript 包（称为@myscope/tspackage）。您可以在这里找到我为此问题创建的示例存储库：https://github.com/sigalor/typescript-transpile-workspace-packages

\n

该文件apps/tsapp/src/index.ts如下所示：

\n

import { sum } from "@myscope/tspackage";\n\nconsole.log("The sum is:", sum(2, 3));\n

\n

该文件packages/tspackage/src/index.ts仅包含以下内容：

\n

export function sum(a: number, b: number): number {\n  return a + b;\n}\n

\n

现在npm run dev在存储库的根目录中运行会产生以下结果：

\n

> typescript-transpile-workspace-packages@0.0.0 dev\n> turbo run dev\n\n\xe2\x80\xa2 Packages in scope: @myscope/tsapp, @myscope/tsconfig, @myscope/tspackage\n\xe2\x80\xa2 Running dev in 3 packages\n\xe2\x80\xa2 Remote caching disabled\n@myscope/tsapp:dev: cache bypass, force executing 0f1217618b24762f\n@myscope/tsapp:dev: \n@myscope/tsapp:dev: > @myscope/tsapp@0.0.0 dev\n@myscope/tsapp:dev: > tsc-watch --onSuccess "node ./dist"\n@myscope/tsapp:dev: \n@myscope/tsapp:dev: \n@myscope/tsapp:dev: 12:32:26 - Starting compilation in watch mode...\n@myscope/tsapp:dev: \n@myscope/tsapp:dev: \n@myscope/tsapp:dev: 12:32:27 - Found 0 errors. Watching for file changes.\n@myscope/tsapp:dev: /home/cmd/typescript-transpile-workspace-packages/packages/tspackage/src/index.ts:1\n@myscope/tsapp:dev: export function sum(a: number, b: number): number {\n@myscope/tsapp:dev: ^^^^^^\n@myscope/tsapp:dev: \n@myscope/tsapp:dev: SyntaxError: Unexpected token \'export\'\n@myscope/tsapp:dev:     at internalCompileFunction (node:internal/vm:73:18)\n@myscope/tsapp:dev:     at wrapSafe (node:internal/modules/cjs/loader:1176:20)\n@myscope/tsapp:dev:     at Module._compile (node:internal/modules/cjs/loader:1218:27)\n@myscope/tsapp:dev:     at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)\n@myscope/tsapp:dev:     at Module.load (node:internal/modules/cjs/loader:1117:32)\n@myscope/tsapp:dev:     at Module._load (node:internal/modules/cjs/loader:958:12)\n@myscope/tsapp:dev:     at Module.require (node:internal/modules/cjs/loader:1141:19)\n@myscope/tsapp:dev:     at require (node:internal/modules/cjs/helpers:110:18)\n@myscope/tsapp:dev:     at Object.<anonymous> (/home/cmd/Downloads/typescript-transpile-workspace-packages/apps/tsapp/dist/index.js:3:19)\n@myscope/tsapp:dev:     at Module._compile (node:internal/modules/cjs/loader:1254:14)\n@myscope/tsapp:dev: \n@myscope/tsapp:dev: Node.js v18.16.0\n

\n

当然，我很清楚为什么会发生这种情况：显然@myscope/tspackage没有被 转译tsc-watch，因此无法执行。但我该如何解决这个问题呢？

\n

到目前为止，我已经做到了完全独立地转译，请参阅上面链接的存储库中的@myscope/tspackage分支。tspackage-transpiled但是当我对 进行更改时，它非常乏味@myscope/tspackage，因为我首先必须从 退出 tsc-watch @myscope/tsapp，重新编译@myscope/tspackage，然后再次启动 tsc-watch 。

\n

我注意到 Next.js 有一个transpilePackages正是我想要的选项，但当然仅适用于 Next.js/frontend 宇宙：https ://github.com/vercel/turbo/blob/main/examples/basic/apps /web/next.config.js

\n

标准 TypeScript 是否也存在这样的选项，以便从内部执行的 tsc （或 tsc-watch）@myscope/tsapp也自动转换@myscope/tspackage）？

\n

Answer 1

目前，我在包中使用一个脚本，该脚本需要tsc在开发期间进行转译才能调用。

// package.json
{
  "main": "dist/index.js",
  "scripts": {
    "dev": "tsc --watch"
  }
}

// tsconfig.json
{
  "include": ["src"],
  "compilerOptions": {
    "preserveWatchOutput": true
  }
}

如果这个能在turborepo中使用就好了