모노레포는 코드 공유, 리팩토링, 의존성 관리를 개선합니다. 2026년에는 Turborepo, Nx, pnpm 워크스페이스가 주류입니다.
Turborepo: 설정과 구조
Turborepo는 JavaScript/TypeScript 모노레포에 최적화되어 있습니다.
# Create a new Turborepo monorepo
npx create-turbo@latest my-monorepo
cd my-monorepo
# Or add Turborepo to an existing monorepo
npm install turbo --save-dev
# Directory structure
my-monorepo/
├── apps/
│ ├── web/ # Next.js app
│ └── docs/ # Docs site
├── packages/
│ ├── ui/ # Shared React components
│ ├── utils/ # Shared utilities
│ └── tsconfig/ # Shared TypeScript configs
├── turbo.json # Pipeline configuration
└── package.json # Root workspace configTurborepo 파이프라인 설정
turbo.json 파이프라인은 태스크 간의 관계와 캐시할 출력을 정의합니다.
// turbo.json — pipeline definition
{
"$schema": "https://turbo.build/schema.json",
"pipeline": {
"build": {
"dependsOn": ["^build"], // ^ means: run in dependency order
"outputs": [".next/**", "!.next/cache/**", "dist/**"]
},
"test": {
"dependsOn": ["^build"],
"inputs": ["src/**/*.tsx", "src/**/*.ts", "test/**/*.ts"]
},
"lint": {
"outputs": []
},
"dev": {
"cache": false, // Never cache dev servers
"persistent": true // Long-running task
},
"type-check": {
"dependsOn": ["^build"],
"outputs": []
}
},
"globalEnv": ["NODE_ENV", "DATABASE_URL"]
}
# Run all build tasks (uses cache if inputs unchanged)
npx turbo build
# Run only for specific apps/packages
npx turbo build --filter=web
npx turbo build --filter=...ui # ui and all its dependents
# Force re-run (bypass cache)
npx turbo build --force
# View task graph
npx turbo build --graphNx: 설정과 프로젝트 그래프
Nx는 코드 생성기, affected 명령 등 더 풍부한 기능을 제공합니다.
# Create Nx monorepo
npx create-nx-workspace@latest my-nx-repo --preset=ts
# Add Nx to existing monorepo
npx nx@latest init
# Generate a new app or library
nx generate @nx/next:app web
nx generate @nx/react:library ui
nx generate @nx/node:library utils
# nx.json — workspace configuration
{
"tasksRunnerOptions": {
"default": {
"runner": "nx/tasks-runners/default",
"options": {
"cacheableOperations": ["build", "test", "lint", "e2e"],
"parallel": 3
}
}
},
"targetDefaults": {
"build": {
"dependsOn": ["^build"],
"inputs": ["production", "^production"]
}
},
"namedInputs": {
"default": ["{projectRoot}/**/*", "sharedGlobals"],
"production": ["default", "!{projectRoot}/**/?(*.)+(spec|test).[jt]s?(x)"],
"sharedGlobals": []
}
}pnpm 워크스페이스: 경량 접근법
pnpm 워크스페이스는 추가 도구 없이 네이티브 모노레포 지원을 제공합니다.
# pnpm-workspace.yaml
packages:
- 'apps/*'
- 'packages/*'
# Install all workspace dependencies
pnpm install
# Add a package to a specific workspace
pnpm add react --filter @myapp/web
# Add a local workspace package as dependency
# In apps/web/package.json:
{
"dependencies": {
"@myapp/ui": "workspace:*"
}
}
# Run scripts across all packages
pnpm --filter '*' run build
pnpm --filter './apps/*' run dev
pnpm --filter '...@myapp/ui' run test # ui and dependents
# Publish all public packages
pnpm publish -r --access public원격 캐시
원격 캐시는 개발자와 CI 시스템 간에 빌드 아티팩트를 공유합니다.
# Turborepo Remote Cache (Vercel)
# Enables sharing build cache across developers and CI
# 1. Link to Vercel
npx turbo login
npx turbo link
# 2. Now CI builds share cache with local dev:
# CI run: builds from scratch, uploads to cache
# Developer: pulls cache, gets instant builds
# Self-host with Turborepo Remote Cache (open source)
# docker run -p 3000:3000 ducktors/turborepo-remote-cache
# .turbo/config.json (auto-generated by turbo link)
{
"teamId": "team_xxx",
"apiUrl": "https://vercel.com"
}
# Nx Cloud (similar offering from Nx)
# nx connect-to-nx-cloud
# Provides remote caching + task distributionChangesets로 버전 관리
Changesets는 모노레포에서 패키지를 버전 관리하고 게시하는 표준 도구입니다.
# Changesets — versioning and publishing for monorepos
# Works with npm/yarn/pnpm workspaces
pnpm add -D @changesets/cli
pnpm changeset init
# When you make a change that needs a version bump:
pnpm changeset
# → Interactive prompt: which packages changed, bump type (major/minor/patch)
# Creates a markdown file in .changeset/ describing the change
# Example .changeset/funny-bears-dance.md:
---
"@myapp/ui": minor
"@myapp/utils": patch
---
Add new Button component with loading state
# Apply changesets (bumps versions, updates CHANGELOG.md)
pnpm changeset version
# Publish all changed packages
pnpm changeset publishTurborepo vs Nx vs pnpm 워크스페이스
| Feature | Turborepo | Nx | pnpm Workspaces |
|---|---|---|---|
| Setup complexity | Low | Medium | Very Low |
| Task caching | Built-in | Built-in | Manual/external |
| Remote cache | Vercel (free tier) | Nx Cloud (paid) | None built-in |
| Code generators | No | Yes (rich) | No |
| Affected detection | Basic (--filter) | Advanced (nx affected) | Via Changesets |
| Language support | JS/TS focused | Polyglot | Any |
| Learning curve | Low | Medium-High | Low |
모범 사례
- pnpm 워크스페이스 + Turborepo로 시작하세요.
- 명확한 경계를 정의하세요: 공유 패키지는 packages/, 앱은 apps/에.
- 버전 관리에 Changesets를 사용하세요.
- 원격 캐시를 일찍 활성화하세요.
- 각 패키지의 package.json을 명시적으로 유지하세요.
자주 묻는 질문
Turborepo와 Nx 중 어느 것을 선택해야 하나요?
Turborepo는 대부분의 JS 프로젝트에 더 간단합니다. Nx는 대규모 저장소를 위한 더 많은 기능을 갖고 있습니다.
모노레포와 폴리레포의 차이는?
모노레포는 모든 코드를 하나의 저장소에 저장합니다.
Turborepo 캐싱은 어떻게 작동하나요?
Turborepo는 각 태스크의 입력을 해시하고 캐시에서 출력을 복원합니다.
모노레포에서 다른 패키지 관리자를 사용할 수 있나요?
아니요. 모든 워크스페이스는 동일한 패키지 관리자를 사용해야 합니다.
모노레포에서 환경 변수는 어떻게 처리하나요?
앱별로 환경 변수를 정의하고 turbo.json globalEnv에 나열하세요.