> ## Documentation Index
> Fetch the complete documentation index at: https://extension.js.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Multi-platform builds for Chrome, Edge, and Firefox

> Build and package the same extension for Chrome, Edge, and Firefox without separate build scripts. Output artifacts to dist and generate zip packages.

Build and package the same extension for multiple browsers with predictable outputs.

Ship the same extension to Chrome, Edge, and Firefox without maintaining separate build scripts. Extension.js runs production builds per target and writes artifacts to `dist/<browser>`. It can also generate zip packages for distribution.

## How it works

Run a production build:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build
  ```

  ```bash pnpm theme={null}
  pnpx extension build
  ```

  ```bash yarn theme={null}
  yarn dlx extension build
  ```

  ```bash bun theme={null}
  bunx extension build
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build
  ```
</CodeGroup>

The default browser target is `chromium` unless you override it.

## Browser selection

You can target a specific browser/engine:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --browser=chrome
  ```

  ```bash pnpm theme={null}
  pnpx extension build --browser=chrome
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --browser=chrome
  ```

  ```bash bun theme={null}
  bunx extension build --browser=chrome
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --browser=chrome
  ```
</CodeGroup>

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --browser=firefox
  ```

  ```bash pnpm theme={null}
  pnpx extension build --browser=firefox
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --browser=firefox
  ```

  ```bash bun theme={null}
  bunx extension build --browser=firefox
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --browser=firefox
  ```
</CodeGroup>

Supported values include:

* `chrome`
* `edge`
* `firefox`
* `chromium`
* `chromium-based`
* `gecko-based` / `firefox-based` (aliases)

You can also run a build matrix in one command:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --browser=chrome,edge,firefox
  ```

  ```bash pnpm theme={null}
  pnpx extension build --browser=chrome,edge,firefox
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --browser=chrome,edge,firefox
  ```

  ```bash bun theme={null}
  bunx extension build --browser=chrome,edge,firefox
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --browser=chrome,edge,firefox
  ```
</CodeGroup>

This builds sequentially for `chrome`, `edge`, and `firefox`.

## Output layout

Each target writes to its own folder:

* `dist/chrome`
* `dist/edge`
* `dist/firefox`
* `dist/chromium`
* `dist/chromium-based`
* `dist/gecko-based`

The folder is always named after the requested target, even when `dev` launches a different Chromium-family binary as a fallback. See [Requested target vs. launch binary](/docs/browsers/browsers-available#requested-target-vs-launch-binary).

### Build capabilities

| Option                  | What it does                                                                         |
| ----------------------- | ------------------------------------------------------------------------------------ |
| `--browser=<target>`    | Builds for a specific browser or engine family.                                      |
| `--zip`                 | Creates a distribution zip per target output.                                        |
| `--zip-filename=<name>` | Overrides the default zip file name.                                                 |
| `--zip-source`          | Creates a source archive alongside output.                                           |
| `--polyfill`            | Enables compatibility behavior for `browser.*` API usage in Chromium-family targets. |

## Generating a zip file

Generate a distribution zip from each target output with `--zip`:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --zip
  ```

  ```bash pnpm theme={null}
  pnpx extension build --zip
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --zip
  ```

  ```bash bun theme={null}
  bunx extension build --zip
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --zip
  ```
</CodeGroup>

By default, the zip name uses sanitized manifest `name` + `version`, for example:

* `my-extension-1.0.0.zip`

Customize filename:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --zip --zip-filename=my-release
  ```

  ```bash pnpm theme={null}
  pnpx extension build --zip --zip-filename=my-release
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --zip --zip-filename=my-release
  ```

  ```bash bun theme={null}
  bunx extension build --zip --zip-filename=my-release
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --zip --zip-filename=my-release
  ```
</CodeGroup>

This creates `my-release.zip` inside the target `dist/<browser>` folder.

## Include source archive

Use `--zip-source` to generate a source archive alongside distribution output.

`--zip-source` produces:

* `dist/<name>-<version>-source.zip`

## Polyfilling browser APIs

If your code relies on Gecko-style `browser.*` APIs and you need Chromium compatibility, enable `--polyfill`:

<CodeGroup>
  ```bash npm theme={null}
  npx extension build --polyfill
  ```

  ```bash pnpm theme={null}
  pnpx extension build --polyfill
  ```

  ```bash yarn theme={null}
  yarn dlx extension build --polyfill
  ```

  ```bash bun theme={null}
  bunx extension build --polyfill
  ```

  ```bash deno theme={null}
  deno run -A npm:extension build --polyfill
  ```
</CodeGroup>

## Best practices

* **Build per target in continuous integration (CI)**: Treat each browser output as an independent artifact.
* **Use a browser matrix command for parity checks**: Catch target-specific issues early in one pipeline step.
* **Package intentionally**: Use `--zip` for store uploads and `--zip-source` for traceable source artifacts.
* **Keep target configuration explicit**: Use `extension.config.*` command/browser defaults for reproducible builds.

## Next steps

* Learn more about the [Browsers available](/docs/browsers/browsers-available).
* Explore [Path resolution](/docs/features/path-resolution) for asset/output mapping details.