Open-Source Wikis

/

tldraw

/

How to contribute

/

Tooling

tldraw/tldraw

Tooling

Build, lint, format, and code-quality tooling.

Workspace orchestration: lazyrepo

lazy.config.ts at the repo root is the orchestrator. Every workspace's scripts.build, scripts.dev, etc. routes through lazy run <task>. lazyrepo handles incremental rebuilds and parallelism by hashing inputs and outputs.

The root scripts in package.json use lazy to fan out:

"build": "lazy build",
"dev": "LAZYREPO_PRETTY_OUTPUT=0 lazy run dev --filter='apps/examples' --filter='packages/tldraw' --filter='apps/bemo-worker' --filter='apps/dotcom/image-resize-worker'"

Setting LAZYREPO_PRETTY_OUTPUT=0 produces unbuffered output suited to dev servers.

Builds: internal/scripts

The actual build logic for SDK packages lives in internal/scripts/:

  • build-package.ts — compiles a single package's src/ to dist/ with esbuild plus .tsbuild/ declaration files.
  • build-api.ts — runs api-extractor to generate api-report.api.md and *.d.ts rollups.
  • prepack.ts — staged setup before yarn pack.
  • postpack.sh — restores files after pack.
  • typecheck.ts — refreshes assets, then runs tsgo (the TypeScript Native Preview) across the workspace.
  • lint.ts — wraps oxlint and oxlint-tsgolint for repo-wide and --current runs.
  • clean.sh — wipes build artifacts.
  • check-packages.ts, check-circular-deps.ts — sanity checks.

Lint and format: oxlint + oxfmt

The repo migrated to the Oxc toolchain:

  • oxlint is the linter. Config: .oxlintrc.json (12 KB of rules) plus .oxfmtrc.json.
  • oxfmt is the formatter. Runs via Husky + lint-staged on commit.
  • The legacy ESLint config in eslint.config.mjs (12 KB) carries custom rules under internal/config/eslint-plugin/ (e.g., tldraw/no-export-star).
  • Prettier is still used for some files; .prettierrc and .prettierignore live at the repo root.
  • internal/scripts/lint.ts is the wrapper. yarn lint-current lints only files changed against main.

Typecheck: tsgo (native TypeScript)

internal/scripts/typecheck.ts runs @typescript/native-preview (tsgo) across the workspace after refreshing assets. Never run bare tsc (per AGENTS.md). Use yarn typecheck.

Public API: api-extractor

Each SDK package emits an api-report.api.md via yarn build-api. The reports are version-controlled. CI runs yarn api-check which fails if a public surface changed without a corresponding committed report. tsdoc.json at the repo root configures @microsoft/tsdoc for the project (it is also patched via .yarn/patches/).

Test runner: Vitest

  • Root config: vitest.config.ts.
  • Per-package config: <workspace>/vitest.config.ts where needed.
  • Canvas mock: vitest-canvas-mock.
  • Coverage: @vitest/coverage-v8 (yarn test-coverage).

E2E: Playwright

  • Examples: apps/examples/playwright.config.ts.
  • dotcom: apps/dotcom/client/playwright.config.ts.
  • Performance: playwright-perf.yml workflow.

Translations

  • Source strings: packages/assets/translations/.
  • Build: yarn build-i18n (lazy task build-i18n).
  • Upload/download to/from external translation service: yarn i18n-upload-strings, yarn i18n-download-strings (drive internal/scripts/i18n-*.ts).
  • Check: yarn i18n-check (@lingual/i18n-check).

Asset pipeline

  • Source assets: assets/ at the repo root.
  • Generated modules: packages/assets/src/.
  • Refresh: yarn refresh-assets (also runs from postinstall and as a step in yarn typecheck).

Husky and lint-staged

  • .husky/ contains the git hooks.
  • lint-staged configuration in package.json runs oxfmt --no-error-on-unmatched-pattern on every staged JS/TS/CSS/MD/JSON/YAML file.

Internal automation

  • internal/scripts/deploy-dotcom.ts — coordinates dotcom deploys.
  • internal/scripts/extract-draft-changelog.tsx — release notes drafting.
  • internal/scripts/dev-template.sh — runs a template under templates/ against the live workspace.
  • internal/scripts/update-pr-template.ts — keeps .github/pull_request_template.md in sync with internal state.
  • internal/scripts/generate-test-licenses.ts — exercises license-key flow for testing.
  • internal/scripts/profile-typescript.ts, profile-tsserver.ts — TS performance profiling.
  • internal/huppy/ — the Huppy bot.
  • internal/health-worker/ — health-check worker for production services.

Editor settings

  • .vscode/ ships shared VS Code settings and recommended extensions.
  • .cursor-plugin/ and .cursor/ contain Cursor IDE customizations.
  • .claude/ and .agents/ are symlinks to skills/ so each agent CLI sees the same skill library.

Built by Factory AutoWiki from public repository content. It is a generated preview for codebase exploration, not source-maintained documentation.

Tooling – tldraw wiki | Factory