有没有办法在（浏览器）ES6模块中导入非模块变量？

Question

这是针对浏览器 JavaScript 的。假设我有一个外部 Javascript 库：

// feature.js
var Feature = { /* ... */ }

通常，您在 HTML 中引用该文件，并且您会在全局范围内获得一个

Feature

变量。有没有办法从我的 ES6 模块导入它，这样它就不会污染它之外的全局范围？像这样的东西（不起作用）：

// index.js
import "/feature.js"

// Use feature
Feature.foo(); // Feature is not available here

---

同样在我的具体情况下，我注意到这个库末尾有一个 UMD 语句：

"undefined"!=typeof exports&&(exports.Gmail=Gmail)

所以我可以有这样的解决方法，但现在全局范围有一个

exports

变量。这是一个好的解决方法吗？有没有更好的方法将其仅保留在我的模块中？

        (globalThis as any).exports ??= {};

        // @ts-ignore
        await import("/libs/jquery.min.js");
        // @ts-ignore
        await import("/libs/gmail.min.js");

        const Gmail = (globalThis as any).exports.Gmail;

Answer 1

不。您需要向该库添加一个

export

声明，没有办法绕过它。