编译后如何在 webpack 包中扩展函数？答案

【问题标题】：How to extend functions inside webpack bundle after compile?编译后如何在 webpack 包中扩展函数？
【发布时间】：2017-02-21 12:48:49
【问题描述】：

如何在编译后扩展 webpack bundle 中的函数？有人知道吗？

【问题讨论】：

什么意思？
Webpack 创建一个带有函数的文件。我想用 javascript 原型扩展其中的一些。但是问题是编译后如何扩展函数，因为Webpack改变了函数的原始名称。
那么您必须导入它才能获得参考吗？贴一些代码会更容易理解你想要实现的目标

【解决方案1】：

从你的简短问题。我相信您正在尝试访问/扩展或仅在其外部捆绑的 javascript 文件中使用该函数。有不同的方法可以做到这一点。

方法一

如果你想在它之外使用多个这样的函数，那么你必须使用以下方法导出函数：

module.exports = {
      yourfunctionName
}

然后你必须配置你的 webpack 把它当作一个库。大多数图书馆都是这样做的。现在访问捆绑文件之外的功能。只需使用您的库名称（在 webpack 中配置）例如，假设我的库名称是 myLibrary，那么代码将是：

myLibrary.yourFunctionName

方法二

如果您不需要导出许多函数，或者您正在寻找一个快速简单的答案，那么您可以将您的函数添加到窗口对象，这样它就可以在任何地方使用。

在您的主文件中（将被捆绑）filename.bundle.js

window.functionName = yourFunction;

无论您想在捆绑之外访问该功能的任何地方

window.functionName();

不建议将函数放在 window 对象中，但如果您正在寻找快速简便的修复方法，那么方法 2 对您有好处。

【讨论】：