เครื่องมือ Monorepo 2026: Turborepo vs Nx vs Lerna vs pnpm Workspaces

Monorepo ช่วยปรับปรุงการแชร์โค้ด การ refactor และการจัดการ dependencies

Turborepo: การตั้งค่าและโครงสร้าง

Turborepo ได้รับการปรับให้เหมาะสมสำหรับ JavaScript/TypeScript monorepos

# 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 config

การตั้งค่า Pipeline ของ Turborepo

pipeline turbo.json กำหนดความสัมพันธ์ระหว่าง tasks และ outputs ที่จะ cache

// 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 --graph

Nx: การตั้งค่าและกราฟโปรเจ็กต์

Nx มี feature set ที่หลากหลาย: code generators, คำสั่ง 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 Workspaces: แนวทางน้ำหนักเบา

pnpm workspaces รองรับ monorepo แบบ native โดยไม่ต้องใช้เครื่องมือเพิ่มเติม

# 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

Remote Cache

Remote caching แชร์ build artifacts ระหว่าง developers และ 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 distribution

การจัดการเวอร์ชันด้วย Changesets

Changesets คือเครื่องมือมาตรฐานสำหรับการจัดการเวอร์ชันและการเผยแพร่ใน monorepo

# 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 publish

Turborepo vs Nx vs pnpm Workspaces

แนวปฏิบัติที่ดีที่สุด

• เริ่มต้นด้วย pnpm workspaces + Turborepo
• กำหนดขอบเขตที่ชัดเจน: shared packages ใน packages/, apps ใน apps/
• ใช้ Changesets สำหรับการจัดการเวอร์ชัน
• เปิดใช้งาน remote cache ตั้งแต่เนิ่นๆ
• รักษา package.json ของแต่ละ package ให้ชัดเจน

คำถามที่พบบ่อย