单包工作区
虽然 Turborepo 在多包工作区(通常称为 monorepos)中非常有效,但它也可以用来加速单包工作区。
Turborepo 的最重要功能在单包工作区中都能正常工作,包括本地和远程缓存以及任务并行化。不起作用的功能是那些在单包上下文中没有意义的功能,比如包任务(app#build)。
npx create-next-app 或 npm create vite 的输出。安装
将 turbo 安装到您的应用程序中:
pnpm add turbo --save-dev
yarn add turbo --dev
npm install turbo --save-dev
bun install turbo --dev
使用全局 turbo 运行 package.json 脚本(可选)
为了获得更快的开发工作流程,您也可以全局安装 turbo,并直接从命令行运行命令。
安装完成后,您可以运行 turbo build,Turborepo 将运行您 package.json 中的 build 脚本。再次运行 turbo build 将命中缓存。
此时,turbo 并没有提供太多价值,因为您可能只会在代码更改时重新构建应用程序,而当代码更改时,turbo 将错过缓存。通过两个简短的步骤,您可以从 turbo 中获得更多价值。
使用一个命令运行多个脚本
在许多仓库中,都有设置任务或预构建步骤需要运行。这些任务通常一次运行一个 - 但您可以使用 turbo 轻松将它们转换为一个脚本。
例如,假设您有一个项目,每当开始工作时,我们总是必须设置开发环境。您需要:
- 为数据库启动 Docker 容器。
- 将数据库架构推送到数据库。
- 用数据为数据库播种。
- 启动开发服务器。
您可以使用 Turborepo 将这些任务安排到一个命令中。首先,在您的 package.json 中创建脚本:
{
"name": "@acme/my-app",
"version": "0.0.0",
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",
"check-types": "tsc --noEmit",
"db:up": "docker-compose up -d",
"db:push": "your-orm-tool schema-push",
"db:seed": "node ./db-seed.js"
}
}
然后,在 turbo.json 中创建任务以按顺序运行这些脚本:
{
"$schema": "https://turborepo.com/schema.json",
"tasks": {
"dev": {
"dependsOn": ["db:seed"],
"cache": false,
"persistent": true
},
"db:seed": {
"dependsOn": ["db:push"],
"cache": false
},
"db:push": {
"dependsOn": ["db:up"],
"cache": false
},
"db:up": {
"cache": false
}
}
}
上述任务中的 dependsOn 数组为任务创建了顺序。当您运行 turbo dev 时,将首先运行 db:up、然后 db:push、然后 db:seed 的脚本。
并行化任务
使用 turbo 并行化任务可以通过同时运行所有任务来加速任务,当它们可以时。例如,您可以同时运行 ESLint、TypeScript 和 Prettier 检查。给定如下脚本:
{
"scripts": {
"lint": "eslint .",
"format": "prettier .",
"check-types": "tsc --noEmit"
}
}
您可以创建这样的配置:
{
"$schema": "https://turborepo.com/schema.json",
"tasks": {
"lint": {},
"format": {},
"check-types": {}
}
}
然后,同时运行所有任务:
turbo check-types lint format
使用输入优化任务
因为 Turborepo 会将单包工作区视为一个包,所以优化任务的输入有助于确保不相关的更改不会导致缓存未命中。
例如,使用 tsc --noEmit 检查类型的脚本可以配置为仅包含 TypeScript 文件的输入:
{
"$schema": "https://turborepo.com/schema.json",
"tasks": {
"check-types": {
"inputs": ["**/*.{ts,tsx}"]
}
}
}