javascript - 是否可以使用 webpack 在浏览器中动态配置 `publicPath`？

Question

我有一个项目，我将同一个 webpack JS 包部署到多个不同的环境。一些环境使用 CDN 来提供 JS 文件等静态 Assets ，而另一些环境则不使用 CDN，而只是从与项目其余部分相同的根目录提供静态 Assets 。

这个项目也有多个异步 webpack block ，所以我定义了一个 publicPath 来正确加载它们。

当部署到非 cdn 时，webpack 在我的 webpack 配置中使用静态配置的 publicPath 可以正常工作，服务于 /static/ 之类的所有内容。

然而，当部署到使用 CDN 的环境时，这不再适用于异步 block ，因为 webpack 将尝试从 /static/ 访问这些 block ，这意味着他们询问主应用程序服务器而不是CDN.

很明显，我可以在 publicPath 中使用我的 CDN 重新构建项目来解决这个问题。但是，我更愿意在两种情况下都只使用一个部署包。

我的服务器端应用程序提供了一个 javascript 全局详细说明 CDN 根路径，与 window.staticCDNRoot 类似。并且这个全局也存在于非 cdn 情况下，只是指向应用服务器 - 所以它总是解析到正确的位置以从中加载静态 Assets 。

有什么方法可以让 webpack 在运行时利用它，以便 publicPath 变成 window.staticCDNRoot + publicPath 而无需大量黑客攻击？

或者对于这个问题有更好的解决方案吗？

Answer 1

好吧，我一直在寻找这个，然后在决定在这里发布后才找到它!

以防万一其他人需要这个:

解决方案是在进行生产构建时在运行时定义 __webpack_public_path__。但要注意不要在开发中使用它，因为它会扰乱模块的热加载。

更多信息在这里:

http://webpack.github.io/docs/configuration.html#output-publicpath