WXT中文文档（机翻）

Appearance

目标不同浏览器 ​

在使用 WXT 构建扩展时，你可以创建多个版本的目标不同的浏览器和 manifest 版本。

目标一个浏览器 ​

使用 -b 命令行选项为特定浏览器创建独立的构建。默认情况下，会目标浏览器为 Chrome。

sh
wxt            # 等同于：wxt -b chrome
wxt -b firefox
wxt -b custom

在开发过程中，如果目标 Firefox，则 Firefox 会打开。其他所有构建默认会以 Chrome 打开。要自定义哪些浏览器会启动，请参阅 设置浏览器二进制。

此外，WXT 定义了几个可以在运行时检测使用的浏览器的常量：

ts
if (import.meta.env.BROWSER === 'firefox') {
  console.log('只在 Firefox 构建时执行某些操作');
}
if (import.meta.env.FIREFOX) {
  // 简写，等同于上面的 if 语句
}

阅读关于 内置环境变量 的详细说明。

目标特定 manifest 版本 ​

要目标特定 manifest 版本，请使用 --mv2 或 --mv3 命令行选项。

TIP

默认 manifest 版本 默认情况下，WXT 会根据浏览器不同目标 MV2（用于 Safari 和 Firefox）或 MV3。

类似浏览器，你可以在运行时通过 内置环境变量 获取目标的 manifest 版本：

ts
if (import.meta.env.MANIFEST_VERSION === 2) {
  console.log('只在 MV2 构建时执行某些操作');
}

过滤入口点 ​

每个入口点可以通过 include 和 exclude 选项包含或排除，以目标特定浏览器。

以下是一些示例：

  • 只有目标 Firefox 的内容脚本：

    ts
    export default defineContentScript({
  include: ['firefox'],

  main(ctx) {
    // ...
  },
});

  • 只有在不为 Chrome 目标时构建的 HTML 文件：

    html
    <!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="manifest.exclude" content="['chrome', ...]" />
  </head>
  <body>
    <!-- ... -->
  </body>
</html>

或者，你可以使用 filterEntrypoints 配置项来列出所有你想构建的入口点。