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 示例了解具体方法。