如何修复：从 vscode webview 扩展导入包时出现 "exports is not defined" & "require is not defined" 错误

Question

我正在开发一个基于 CatCoding example 的 vscode webview 扩展。

我正在尝试使用标签从 cdn 导入外部 node_module。包已加载，我可以使用它，但在某些导入的函数中存在模块导出，我收到以下错误：Uncaught ReferenceError: exports is not defined

我发现有人用下面的方法解决了"hack":
<script>var exports = {};</script>

所以我试过了，现在我得到了关于 'require':
的相同错误 Uncaught ReferenceError: require is not defined

我只是想做简单的包导入，不知道为什么会这样，可能是因为它作为 webview 运行，也可能是因为 electron？

知道我该如何解决吗？

Answer 1

您正在加载的 JavaScript 包正在使用模块系统，可能是 commonJS。 webview只是一个普通的网页，需要自带模块支持。

为此，您可以直接使用 webpack or include a module loader such as RequireJs 等捆绑器。