Skip to content

ES Modules

你的源代码应始终以 ESM 格式编写。不过,你可以控制入口文件是否以 ESM 格式打包。

HTML 页面 ≥0.0.1

Vite 仅支持将 HTML 页面中的 JS 以 ESM 格式打包。请确保在 <script> 标签中添加了 type="module"

html
<script src="./main.ts"></script> 
<script src="./main.ts" type="module"></script> 

Background ≥0.16.0

默认情况下,你的 background 脚本会被打包为单个 IIFE 文件。你可以通过在 background 入口文件中设置 type: "module" 来更改此行为:

ts
export default defineBackground({
  type: 'module', 
  main() {
    // ...
  },
});

这将把输出格式更改为 ESM,启用 background 脚本与 HTML 页面之间的代码分割,并在 manifest 中设置 "type": "module"

WARNING

仅 MV3 支持 ESM 格式的 background 脚本/Service Worker。当目标为 MV2 时,type 选项会被忽略,background 始终会被打包为单个 IIFE 文件。

Content Scripts

WXT 尚未内置将 content scripts 打包为 ESM 的支持。计划是添加分块支持以减小包体积,但目前不支持 HMR。由于存在若干技术问题,实现通用的 HMR 方案是不可能的。详情请参阅 Content Script ESM Support #357

如果你等不及,现在就需要 ESM 支持,可以手动实现。请参阅 ESM Content Script UI 示例了解具体方法。