Skip to main content

Extension Assembly Pipeline

LightningAddon uses a two-stage build: each app is built by Vite, then repo-assemble combines them into a single extension package.

Stage 1: Vite Builds

Each extension context builds independently:

AppOutputPurpose
apps/backgrounddist/background.jsService worker
apps/popupdist/popup.html, dist/assets/*Extension popup
apps/maindist/index.html, dist/assets/*Full-page dashboard
apps/in-pagedist/content_script.jsContent script injected into pages

Builds run in parallel via Turborepo. Each app has its own dist/ directory.

Stage 2: Assembly

The repo-assemble CLI (from @repo/tooling) reads apps/extension/extension.config.mjs and:

  1. Clears apps/extension/dist/
  2. Copies artifacts from each app's dist/ into the output directory
  3. Copies assets from packages/assets
  4. Injects the correct manifest (manifest.chrome.json or manifest.firefox.json) as manifest.json

Configuration

extension.config.mjs defines:

  • manifests — Which manifest file to use per build env (chrome, firefox)
  • artifacts — Which files to copy and where (e.g. popup.html, background.js, content_script.js)
  • assetsDir — Icons and static files
  • assetExcludes — Files to skip when copying assets

Build Commands

pnpm build:chrome   # BUILD_ENV=chrome → uses manifest.chrome.json
pnpm build:firefox # BUILD_ENV=firefox → uses manifest.firefox.json

Both produce output in apps/extension/dist/. Load that directory as an unpacked extension in Chrome or Firefox.

Adding a Store-Specific Build

To target a specific store (e.g. Edge with its own listing):

  1. Add manifest.edge.json to apps/extension/manifests/
  2. Register it in extension.config.mjs:
    manifests: {
    chrome: 'manifest.chrome.json',
    firefox: 'manifest.firefox.json',
    edge: 'manifest.edge.json',
    },
  3. Run BUILD_ENV=edge pnpm build (or add build:edge script)

No source code changes needed—only the manifest differs.

Artifact Dependencies

The assemble step requires that dependent packages have already built. Turborepo's ^build graph ensures @repo/background, @repo/popup, etc. are built before assemble runs.