DevToolBoxGRATIS
Blog

Alat Monorepo 2026: Turborepo vs Nx vs Lerna vs pnpm Workspaces

15 menitoleh DevToolBox

Monorepo meningkatkan berbagi kode, refactoring, dan manajemen dependensi.

Turborepo: Setup dan Struktur

Turborepo dioptimalkan untuk monorepo 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 config

Konfigurasi Pipeline Turborepo

Pipeline turbo.json mendefinisikan bagaimana tugas-tugas saling berhubungan.

// 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: Setup dan Grafik Proyek

Nx menyediakan set fitur yang lebih kaya: generator kode, perintah 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: Pendekatan Ringan

pnpm workspaces menyediakan dukungan monorepo native tanpa alat tambahan.

# 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

Cache Jarak Jauh

Remote caching berbagi artefak build antara developer dan 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

Versioning dengan Changesets

Changesets adalah alat standar untuk versioning dan penerbitan dalam 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

FeatureTurborepoNxpnpm Workspaces
Setup complexityLowMediumVery Low
Task cachingBuilt-inBuilt-inManual/external
Remote cacheVercel (free tier)Nx Cloud (paid)None built-in
Code generatorsNoYes (rich)No
Affected detectionBasic (--filter)Advanced (nx affected)Via Changesets
Language supportJS/TS focusedPolyglotAny
Learning curveLowMedium-HighLow

Praktik Terbaik

  • Mulai dengan pnpm workspaces + Turborepo.
  • Definisikan batas yang jelas: paket bersama di packages/, apps di apps/.
  • Gunakan Changesets untuk versioning.
  • Aktifkan remote cache lebih awal.
  • Jaga setiap package.json agar eksplisit.

FAQ

Turborepo atau Nx?

Turborepo lebih sederhana untuk kebanyakan proyek JS. Nx memiliki lebih banyak fitur untuk repo besar.

Monorepo vs polyrepo?

Monorepo menyimpan semua kode dalam satu repositori.

Bagaimana cara kerja caching Turborepo?

Turborepo meng-hash input setiap tugas dan memulihkan output dari cache.

Package manager berbeda dalam monorepo?

Tidak. Semua workspace harus menggunakan package manager yang sama.

Variabel lingkungan dalam monorepo?

Tentukan variabel per app dan daftarkan di turbo.json globalEnv.

Alat Terkait

𝕏 Twitterin LinkedIn
Apakah ini membantu?

Tetap Update

Dapatkan tips dev mingguan dan tool baru.

Tanpa spam. Berhenti kapan saja.

Coba Alat Terkait

{ }JSON Formatter.git.gitignore Generator

Artikel Terkait

Bun Package Manager: Runtime JavaScript Tercepat di 2026

Panduan lengkap Bun 2026: instalasi, workspace management, scripts, dan mengapa lebih cepat dari npm/yarn/pnpm.

Docker Multi-Stage Builds: Mengoptimalkan Image untuk Produksi

Kuasai multi-stage builds Docker 2026: drastis mengurangi ukuran image, memisahkan dependensi build dan runtime.

Strategi Branching Git: GitFlow vs Trunk-Based vs GitHub Flow

Bandingkan strategi GitFlow, Trunk-Based Development, dan GitHub Flow. Struktur branch, alur merge, integrasi CI/CD, dan cara memilih strategi yang tepat untuk tim Anda.