“this”上下文在 JS 文件中不可用（Webpack 4）答案

【问题标题】："this" context not available in JS file (Webpack 4)“this”上下文在 JS 文件中不可用（Webpack 4）
【发布时间】：2020-04-10 22:30:24
【问题描述】：

我已将我的 webpack 从 3.8.1 迁移到 4.41.2。我一直面临独立 javascript 文件中“this”上下文的问题。请检查以下代码：

util.js

export const calculateSum = (a,b) => {
    this.sum = 0;
    this.sum += a + b;
    return this.sum;
};

请注意，上面是描述问题的示例代码。

在使用 webpack 3.8.1 时，我能够使用上面示例中使用的“this”对象，但在迁移到 4.41.2 后，我无法这样做。

我在非常大的代码库中有很多这样的情况，所以到处更改代码是不可行的。在 webpack 配置中找不到这样的选项。

如何在新版本的 webpack 中修复？

【问题讨论】：

“我不能这样做”——请更清楚地描述这意味着什么：是否有任何错误消息？预期的行为是什么？观察到的行为是什么？
@PatrickHund 在使用 webpack 3.8.1 时，每个文件都有自己的上下文，在 this 中可用，这不过是普通的 javascript 对象。将其升级到 4.41.2 后，this 上下文不可用，现在this 的值未定义，因此在我使用过this.something 之类的代码中，由于this 的值现在未定义，因此在代码中出现了中断。我希望这可以解决您的问题，如果您有任何其他疑问，请告诉我。
@HridayModi 创建一个小 git repo 来重现问题，我会看看。
这个函数的 webpack 结果如何？

【解决方案1】：

根据这个 issue ，Webpack 在类定义中将 "this" 变为 undefined。

开发人员说他们修复了 Webpack 4 中的 this 问题，maybe you use global webpack installation

如果webpack安装不成功，可以试试this question，可能是Babel问题。

Babel 6，Babel 7 有不同的解决方案，你可以根据你的 Babel 版本尝试配置。

希望这会有所帮助。

【讨论】：

【解决方案2】：

尝试：输出： { 全局对象：“这个” }

【讨论】：