将Chrome扩展程序的背景脚本分成多个脚本 - manifest v3。

11
在谷歌浏览器扩展程序的manifest v3版本之前,我可以将background.js拆分为多个脚本。为了加载所有脚本并在background.js中显示它们,我只需要将它们放入清单中的数组中,例如:
    "background": {
    "scripts": ["helpers/countHelper.js", "helpers/networkHelper.js", "background/main.js"],
}

使用以上语法,所有脚本将合并为一个文件。

现在在如何使用manifest v3的文档中,他们写道:

在manifest.json中将background.page或background.scripts替换为background.service_worker。请注意,service_worker字段接受一个字符串,而不是一个字符串数组。

由于manifest中的background无法接受多个脚本,因此如何将background脚本分成多个脚本。 此外,据我所知,不允许使用import语法。

1个回答

12

使用上面的语法,所有脚本将被合并为一个文件。

这并不是真的,但让我们飞过去...

你可以使用importScript,但不能在清单中使用。看看这个模板:

/* V3 manifest.json */
"background": {
    "service_worker": "worker_wrapper.js"
},

/* worker_wrapper.js */
try {
    importScripts("helpers/countHelper.js", "helpers/networkHelper.js", "background/main.js");
} catch (e) {
    console.log(e);
}

请记住,SW文件必须放在根目录中,而其他脚本可以放在其他文件夹中。


4
我遇到了错误,错误信息是TypeError: Failed to execute 'importScripts' on 'WorkerGlobalScope': Module scripts don't support importScripts(),出错位置在background.ts文件的第3行第5个字符。 - rbansal
1
@rbansal请确保在清单文件中从后台service_worker中删除"type: module"。然后它就可以工作了。 - mdiener
请记住,SW文件必须放置在根目录中。这是为什么?这是MV3的要求吗? - Kritidipto Ghosh
你说得对。它不再是这样了。 - Robbi

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接