Skip to main content

​
Overview

Openlane UI is built as a monorepo using Turborepo, managed by Bun. This structure enables efficient code sharing, unified build processes, and streamlined dependency management across all applications and packages.

Apps

2 production applications

Packages

5 shared internal packages

Build Tool

Turborepo 2.8.10

Package Manager

Bun 1.2.16

​
Workspace Structure

The monorepo is organized using Bun workspaces, defined in the root package.json: 
"workspaces": [
  "apps/*",
  "packages/*"
]

​
Directory Layout

openlane-ui/
├── apps/
│   ├── console/          # Main Openlane Console application
│   └── storybook/        # Component documentation and testing
├── packages/
│   ├── ui/               # Shared UI component library
│   ├── codegen/          # GraphQL code generation
│   ├── dally/            # Data Access Layer (DAL)
│   ├── eslint-config/    # Shared ESLint configurations
│   └── config-typescript/# Shared TypeScript configurations
├── turbo.json            # Turborepo configuration
└── package.json          # Root package configuration

​
Turborepo Configuration

The turbo.json file defines task pipelines and dependencies: 
"build": {
  "dependsOn": ["^build"],
  "outputs": ["dist/**", ".next/**", "!.next/cache/**", "storybook-static/**"]
}
  • dependsOn: Ensures dependencies are built before dependents
  • outputs: Defines cacheable build artifacts
  • Environment variables: 40+ environment variables for builds
"dev": {
  "cache": false,
  "persistent": true
}
  • cache: Disabled for development to ensure fresh builds
  • persistent: Keeps dev servers running
"globalDependencies": ["**/.env.*local", "**/.env", ".env"]
Turborepo watches these files and invalidates caches when they change.

​
Available Scripts

The root package.json provides workspace-wide commands:
ScriptCommandDescription
buildturbo buildBuild all apps and packages
devturbo dev --parallelRun all dev servers in parallel
debugturbo debugDebug Turborepo configuration
type-checkturbo type-checkType-check all TypeScript code
lintturbo run lintLint all workspaces
clean(custom script)Remove all node_modules and build artifacts
turbo-cleanturbo cleanClean Turborepo cache
formatprettier --write "**/*.{ts,tsx,md}"Format all code

​
Workspace Dependencies

Internal packages are referenced using the workspace:* protocol: 
// In apps/console/package.json
"dependencies": {
  "@repo/codegen": "workspace:*",
  "@repo/dally": "workspace:*",
  "@repo/ui": "workspace:*"
}
This ensures:
  • Always uses the latest local version
  • Enables hot module reloading across packages
  • Simplifies version management

​
Build Pipeline

Turborepo automatically determines the optimal build order:

​
Performance Benefits

Incremental Builds

Only rebuilds changed packages and their dependents

Remote Caching

Share build caches across team members and CI/CD

Parallel Execution

Runs independent tasks simultaneously

Smart Hashing

Detects changes based on content, not timestamps

​
Engine Requirements

The monorepo enforces specific runtime versions: 
"engines": {
  "node": "24.14.x"
},
"packageManager": "[email protected]"
Using different versions of Node.js or Bun may cause compatibility issues. Always use the specified versions.

​
Dependency Resolution

The root package.json includes resolution overrides to ensure consistency: 
"resolutions": {
  "react": "19.2.4",
  "gaxios": "^7.0.0",
  "node-fetch": "^3.3.2"
}
This prevents version conflicts across the entire monorepo.

​
Best Practices

  1. Create a new directory in packages/ or apps/
  2. Add a package.json with a unique name (e.g., @repo/my-package)
  3. Update dependent packages to include "@repo/my-package": "workspace:*"
  4. Run bun install to link workspaces
  • Install shared dependencies at the root level
  • Install package-specific dependencies in the package directory
  • Use bun add <package> --workspace-root for root dependencies
  • Use turbo <task> to run tasks across all workspaces
  • Use --filter=<package> to target specific packages
  • Example: turbo build --filter=console

Packages Overview

Explore all packages in detail

Tech Stack

View the complete technology stack

Build docs developers (and LLMs) love

Get started for freeTalk to us