build 会以生产模式编译你的扩展,并将输出写入 dist/<browser>。
对于 monorepo / 子模块项目,关于配置期的环境变量解析(优先项目根,再退回工作区根),请参见 环境变量。
什么时候使用 build
- 为 Chrome Web Store、Edge Add-ons 或 Firefox Add-ons 准备扩展包。
- 在持续集成(CI)中跑出可复现的生产产物。
- 在提交前验证生产打包的输出以及各浏览器目标之间的差异。
build 命令的能力
用法
build 输出
运行build 后,Extension.js 会为所选浏览器目标生成优化过的文件。输出位于 dist/,每个目标一个子目录。每个目录都包含打包后的 JavaScript、CSS、HTML 和必要的运行时资源。
对于 TypeScript 项目,
build 也会重新生成 extension-env.d.ts
环境类型声明(与 dev 写出的是同一个文件),
所以无论你之前是否运行过 dev,CI 上的 tsc --noEmit 都能保持干净。 纯
JavaScript 项目会跳过这一步。浏览器目标矩阵
引擎目标对 build 意味着什么
build 不会启动浏览器,因此引擎目标在这里并不指向某个二进制——但它们仍会产出一个独立的产物,而不是具名目标构建的改名副本:
- 独立的输出目录。
--browser=chromium-based输出到dist/chromium-based,与dev、preview、start在该目标下使用的目录一致——用自定义 Chromium 二进制开发的项目,构建产物路径完全对应。 - 独立的 env 解析。
.env.chromium-based与.env.chromium-based.production优先于家族级的.env.chromium/.env.chrome/.env.edge,且打包后的代码中EXTENSION_BROWSER === "chromium-based"——代码与配置可以据此区分“通用 Chromium”与某个具体商店构建。 - 独立的 manifest 前缀。
manifest.json中的chromium-based:键会作为该目标最具体的匹配生效,叠加在家族级chrome:/chromium:/edge:键之上。
gecko-based 相对 firefox 的行为完全相同。构建不需要浏览器二进制——--chromium-binary/--gecko-binary 只对会启动浏览器的命令有意义。
参数与 flag
共享的全局选项
也支持 全局 flag。模式覆盖
--mode 会覆盖构建的打包器模式以及 NODE_ENV。可选值为 development、production 或 none。当你需要为 staging 或调试产出非生产 bundle 时(类似 Vite / webpack 的工作流),可以用它来对齐行为。
production。
zip 行为
示例
带 zip 输出与自定义文件名的构建
my-extension.zip。
带 polyfill 支持的构建
构建源代码与产物 zip
最佳实践
- 查看构建日志: 每次构建后检查日志,看是否有警告与缺失资源。
- 优化你的 manifest: 让
manifest.json与每个目标浏览器都兼容。 - 有意识地命名产物: 用
--zip-filename让 CI 产物命名保持稳定。 - 逐个目标验证输出: 发布前检查每一个
dist/<browser>目录。
下一步
- 用
@extension.dev/deploy(npx @extension.dev/deploy)把产物发布到浏览器商店——构建成功后终端也会打印这条提示。 - 用
preview运行已有的构建产物。 - 用
start一条命令构建并启动。 - 在
extension.config.js中集中配置共享默认值。 - 在 环境变量 中查看配置期的 env 加载行为。
- 在 可用浏览器 中查看支持的目标。

