从外部 webpack 导入（运行时导入）答案

【问题标题】：Importing from outside webpack (runtime importing)从外部 webpack 导入（运行时导入）
【发布时间】：2020-02-01 13:12:29
【问题描述】：

这只是我今天的想法，我没有看到很多信息，所以我将分享这个奇怪案例以及我个人如何解决它们（如果有更好的方法请评论，但同时这可能对其他人有帮助^^）

在 webpack 包中，您所做的每个 import/require 都由 webpack 使用其内部 require 函数进行管理。这意味着如果你在 webpack 包中，你不能再使用原来的 NodeJS 全局 require。

另请参阅：Exporting from outside webpack bundle

【问题讨论】：

相关：hackernoon.com/…

标签： javascript node.js typescript webpack

【解决方案1】：

实际上webpack提供了一个解决方法：

一个名为 __non_webpack_require__ 的变量是原来的 require 所以，在你的代码中，你可以这样做：

const internalModule = require('internal/module');
// or import internalModule from 'internal/module'; in the ES6 way

const externalModule = __non_webpack_require__('external/module');

如果您使用的是 TypeScript，您可以在 global.d.ts 文件中添加这一行以避免语法错误：

declare const __non_webpack_require__: NodeRequireFunction;

事实一：其实在构建之后，你可以看到你常用的require（webpack的）是如何被重命名为__webpack_require__的，而__non_webpack_require__被保留为原来的require.

事实2： Webpack也使用原来的require从系统中导入模块（不捆绑代码），如net、events、fs等.

【讨论】：

有趣。那么您是说 non_webpack_require 在运行时可全局访问，以访问任何单个模块吗？例如，<script>var $ = __non_webpack_require__ ('jquery');</script> 当然，这也取决于生成的构建中存在哪些模块？无论如何，我认为我的问题的答案是“不”，但我正在寻找一些澄清，因为我仍在学习 Webpack 的深度，来自 RequireJS 世界。
@JasperTey __non_webpack_require__ 将是本机 nodeJS require，当然在服务器端