仓库
文档
单仓库手册
代码风格检查
TypeScript

单仓库中的 TypeScript

您可以在单仓库中以两种方式使用 TypeScript - 作为代码风格检查器，或作为构建工具。

在本节中，我们将讨论 TypeScript 作为代码风格检查器的作用。当您阻止 TypeScript 导出文件（使用 noEmit (在新标签页中打开)）时，就会发生这种情况，而只是使用它来检查源代码的类型。

共享 tsconfig.json

我们可以通过一个巧妙的解决方案在整个仓库中共享 TypeScript 配置文件。我们可以将我们的基础 tsconfig.json 文件放在一个工作区中，并从我们应用程序中的 tsconfig.json 文件中extend 它们。

让我们想象一个这样的工作区

apps
├─ docs
│  ├─ package.json
│  ├─ tsconfig.json
├─ web
│  ├─ package.json
│  ├─ tsconfig.json
packages
├─ tsconfig
│  ├─ base.json
│  ├─ nextjs.json
│  ├─ package.json
│  ├─ react-library.json

我们的 tsconfig 包

在 packages/tsconfig 中，我们有一些 json 文件，它们代表了您可能想要配置 TypeScript 的不同方式。它们看起来都像这样

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Default",
  "compilerOptions": {
    "esModuleInterop": true,
    "skipLibCheck": true,
    "target": "es2022",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "moduleResolution": "Bundler",
    "module": "ESNext",
    "noEmit": true,
    "lib": ["es2022", "dom", "dom.iterable"],
  },
  "exclude": ["node_modules"]
}

在 package.json 中，我们只是命名了我们的包

{
  "name": "tsconfig"
}

存储库中的其他 json 文件可以通过简单的导入访问

import baseJson from "tsconfig/base.json";
import nextjsJson from "tsconfig/nextjs.json";
import reactLibraryJson from "tsconfig/react-library.json";

这使我们能够为不同类型的项目导出不同的配置设置。

如何使用 tsconfig 包

每个使用我们共享的 tsconfig 的应用程序/包必须首先将其指定为依赖项

{
  "dependencies": {
    "tsconfig": "*"
  }
}

然后，它们可以在自己的 tsconfig.json 中扩展它

{
  // We extend it from here!
  "extends": "tsconfig/nextjs.json",
 
  // You can specify your own include/exclude
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

总结

当您使用 npx create-turbo@latest 创建新的单仓库 时，此设置默认提供。您还可以查看 我们的基本示例 (在新标签页中打开)，以查看工作版本。

运行任务

我们建议您按照 基础 部分中的设置进行操作。