IEpack中的Webpack隐式供应商/清单块 - Promise未定义

Question

精简版

当我在IE11中运行我的应用程序时,我Promise is undefined在manifest.js文件中收到错误说明.

如何在执行清单之前添加babel-polyfill或类似运行？

长版

我正在尝试将CommonsChunkPlugin添加到我的webpack配置中,以便将第三方(npm包)脚本拆分为单独的包.根据Webpack 2文档,我已经设置了" 组合隐式公共供应商块和清单文件 ",这在现代浏览器中运行良好.

我编写了一个函数来确保块以正确的顺序包含在我的索引文件中(见下文).

关于我的两个明确的切入点的一些背景知识:

• legacy_libs - 放置在全局命名空间中的旧库script-loader.我希望随着时间的推移逐步淘汰这些
• main - 我的主要app入口点

另外两个(供应商和清单)是隐式的,并使用CommonsChunkPlugin创建.

当我用IE11运行时,我收到一个错误:Promise is undefined.这似乎是因为webpack表明自己正在调用new Promise().

在我的主要切入点我有import 'babel-polyfill';.在我添加供应商和清单分块之前,这使我能够克服IE缺乏Promise的问题.但是现在我首先加载了manifest.js,我无法弄清楚如何以正确的顺序包含它.

我的配置如下:

module.exports = {
  entry: {
    legacy_libs: './app/libs.js',
    main: './app/main.js'
  },
  ...
  plugins: [
    // Extract third party libraries into a separate vendor bundle.
    // Also extract webpack manifest into its own bundle (to prevent vendor hash changing when app source changes)
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: function (module) {
        return module.context && module.context.indexOf('node_modules') !== -1;
      }
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'manifest'
    }),

    // Generate index.html file.
    // Include script bundles in the right order based on chunk name prefixes.
    new HtmlWebpackPlugin({
      template: 'app/index.ejs',
      chunksSortMode: function (a, b) {
        const chunkOrder = ['manifest', 'vendor', 'legacy_libs', 'main'];
        const aChunk = chunkOrder.findIndex(chunk => a.names[0].startsWith(chunk));
        const bChunk = chunkOrder.findIndex(chunk => b.names[0].startsWith(chunk));
        const aValue = (aChunk > -1) ? aChunk : chunkOrder.length;
        const bValue = (bChunk > -1) ? bChunk : chunkOrder.length;
        return aValue - bValue;
      }
    })
}

Answer 1

这似乎是 webpack 2.6.0 引入的问题，已经发布了一个错误： https: //github.com/webpack/webpack/issues/4916

因此，要么等到 bug 修复发布，要么恢复到 2.5.1！