Create a Production Build

To create a production bundle for distribution, run:

pnpm build
# OR
npm run build

Generating a zip bundle

To create a production zip bundle ready to be uploaded to the web stores, use the package command:

pnpm package
# OR
npm run package

If you would like to combine the building and packaging process, use the --zip flag with the build command instead:

pnpm build --zip
# OR
npm run build -- --zip

With a specific target

The build command accepts a --target flag in the form of <browser-name>-<manifest-version>. Use it to specify a browser and manifest version combination to build for:

plasmo build --target=firefox-mv2

The final bundle will be available in the build/firefox-mv2-prod directory. You may use any pairs of target browser and manifest version.

For a list of officially supported targets, visit this link. These targets are recognized by the bundler, which will automatically handle some vendor-specific behavior for you.

The --target flag also enables you to:

• Use a target-specific environment file: .env.<browser-name>
• Use a target-specific entry files: e.g popup.<browser-name>.tsx
• Set the process.env.PLASMO_BROWSER to <browser-name>

The third feature works with deadcode elimination. Thus the following code:

if (process.env.PLASMO_BROWSER === "safari") {
  console.log("A")
} else {
  console.log("B")
}

Will be trimmed down to console.log("A") if the target is safari-mv3.

With a custom tag

Plasmo uses the prod tag for your production build. You can use the --tag flag to change this behavior:

plasmo build --tag=staging

The command above will:

• Create the bundle in the build/chrome-mv3-staging directory
• Set the process.env.PLASMO_TAG environment variables to staging
• Parse and prioritize .env.staging or .env.staging.local if any exist

With source maps

By default, Plasmo does not generate source maps for your production bundle. However, you can use the --source-maps flag to change this behavior:

plasmo build --source-maps

Bundle Buddy

If you'd like to analyze your bundle, you can use the --bundle-buddy flag, combined with --source-maps to generate a Bundle Buddy (opens in a new tab) report:

plasmo build --source-maps --bundle-buddy

Optimization

To create a bundle with minification disabled:

plasmo build --no-minify

To create an import-optimized build where the bundle deduplicate and hoist your dependency to the top of the bundle:

plasmo build --hoist

Note that hoisting can potentially break your dependency, especially those that import dynamic dependency via a plugin system. However, hoisting can significantly improve the bundling speed and reduce the size of your bundle.

You may combine these flags as needed.