Chrome扩展动态导入Linux正常，Windows下调用函数报错

问题详情 #

一段Chrome扩展中的动态导入代码：

import("/lib.js").then((lib) => { const p = lib.getFoo() });

在Linux系统的Chrome浏览器中可正常执行，但在Windows系统的Chrome中抛出错误：

Uncaught (in promise) TypeError: lib.getFoo is not a function

排查细节 #

添加console.log("lib= ", lib)后观察到：

• 两个系统初始输出均为：lib= |> Module {Symbol(Symbol.toStringTag): 'Module'}
• 展开Module对象后，Linux下能看到lib.js中的预期导出内容，Windows下仅显示Symbol(Symbol.toStringTag): "Module"，无任何导出方法或属性。

已尝试的无效操作 #

• 检查manifest.json权限配置，未发现跨平台差异
• 转换文件编码（Linux为us-ascii，Windows为UTF-8），问题未解决
• 尝试静态导入，给content.js添加"type": "module"标记，触发错误Cannot use import statement outside a module
• 未使用打包工具，直接通过「Load unpacked」方式加载扩展

可行解决方案尝试 #

1. 确认模块导出语法 #

确保lib.js使用标准ES模块导出：

// 命名导出（推荐）
export function getFoo() {
  // 函数实现
}

// 或默认导出
export default {
  getFoo: function() { /* ... */ }
}

如果lib.js使用CommonJS规范导出（如module.exports = { getFoo }），动态导入后需通过.default访问内容：

import("/lib.js").then((lib) => {
  const p = lib.default.getFoo();
});

Chrome对ES模块与CommonJS的解析逻辑在跨平台环境下可能存在差异，明确导出规范可避免此类问题。

2. 在manifest.json中指定模块类型 #

若使用content script，需在manifest的content_scripts配置中明确标记type: "module"，而非在脚本文件内添加：

"content_scripts": [
  {
    "matches": ["<all_urls>"],
    "js": ["content.js"],
    "type": "module"
  }
]

此配置会告知Chrome以ES模块方式加载脚本，解决静态导入时的模块类型错误。

3. 检查文件路径大小写 #

Windows文件系统不区分大小写，而Linux严格区分。若代码中引用的路径是/lib.js，但实际文件名为/Lib.js或/LIB.js，Windows下虽能找到文件，但会导致模块解析异常。确保文件名与代码中的引用路径完全一致（包括大小写）。

4. 清除缓存并重新加载扩展 #

Windows下Chrome可能缓存了旧的模块数据，尝试：

• 打开扩展管理页面，点击扩展的「重新加载」按钮
• 右键扩展图标，选择「重新加载扩展」
• 清除浏览器缓存（快捷键Ctrl+Shift+Delete，勾选「缓存的图片和文件」）

5. 同步Chrome版本 #

确保Windows与Linux下的Chrome版本一致，不同版本对ES模块的支持存在差异，优先升级至最新稳定版。

内容的提问来源于stack exchange，提问作者ryszard