小编was*_*eff的帖子

在 Chrome 扩展中，我有一个 javascript 函数，我需要从内容脚本和后台工作 JS 文件中重用该函数。

我如何为此组织脚本？

common.js到目前为止，我只设法在as中定义可重用函数

export function commonFunction()
{
  ...
}

...并将其导入background.js：

import { commonFunction } from './common.js';

但是，我找不到从内容脚本重用该函数的方法。理想情况下，我需要在 Manifest V2 和 V3 浏览器之间重复使用相同的代码。

此外，稳定的 Firefox（仍然是 MV2）即使在以下情况下也会因该设计而失败background.js：Uncaught SyntaxError: import declarations may only appear at top level of a module

该错误消息没有帮助，因为该import行确实出现在模块的顶层background.js。

更新 2：这是我可以为 Chrome MV3 制定的最短解决方案。仍然需要帮助使其更加简单/优雅：

async function commonImporter()
{
    return await import((chrome.runtime.getURL ||
      chrome.extension.getURL)("common.js"));
}

async function contentScriptFunctionUsingCommon()
{
    ...
    result …

我正在尝试重用 Service Worker (background.js) 和 content script 之间的某些功能。

在带有 Manifest V3 (104.0b9 Developer Edition) 的 Firefox 中，我一直得到

未捕获的语法错误：导入声明只能出现在模块的顶层

...虽然它在 Chrome 下使用 MV3 (104.0.5112.79) 运行良好。

我尝试了https://javascript.info/import-export中找到的大多数变体，但没有成功。

这是我的示例代码。对于每个实验，我只import在 中保留一行background.js。但是错误消息总是相同的。

背景.js：

import {commonApartFunction} from './common_apart.js';
import * from './common.js';
import { commonFunction } from './common.js';
import * as commonObject from './common.js';
import defaultFunction from './default.js';

function commonCaller() {
  commonApartFunction();
  commonFunction();
  defaultFunction();
  commonObject.commonFunction();
}

通用.js：

export function commonFunction() {
    return 1;
}

common_apart.js：

function commonApartFunction() { …