javascript - 调用Webpack中的多个入口点

我正在使用带有typescript和babel的webpack来管理我的客户端Web应用程序。

我想要一个用于第三方脚本的vendor.js文件，一个main.js文件以及每页脚本，我可以根据需要加载这些脚本以提供页面的特定功能。

正如我所期望的那样，所有脚本都在编译，但是实际上仅调用vendor.js文件。其他被编译，但从未被调用。

以下是我的webpack.config.js文件。

'use strict';

let webpack = require('webpack');

module.exports = {
  entry: {
    main: './assets/js/main.ts',
    "single-page": './assets/js/src/new-loan.ts',
    vendor: [
      "svg4everybody"
    ]
  },
  output: {
    filename: './public/assets/js/[name].js'
  },
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.js']
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      name: "vendor",
      minChunks: Infinity
    })
  ],
  module: {
    loaders: [{
      test: /\.ts(x?)$/,
      loader: 'babel-loader!ts-loader',
      exclude: /node_modules/
    }]
  }
}

以及页面特定文件之一的示例。理想情况下，加载后，此文件将在页面上触发alert通知。

webpackJsonp([1],[
/* 0 */
/***/ function(module, exports) {

    'use strict';

    alert('test');

/***/ }
]);

我可以看到/ why /警报没有触发（永远不会调用模块功能），但是我不知道如何配置webpack使其能够按照我的意愿工作。

感谢您的协助。

最佳答案

我发现CommonsChunkPlugin正在覆盖您配置中的vendor捆绑包。尝试将CommonsChunkPlugin的名称从common更改为vendor，并将common捆绑软件包含在所有文件中，然后再包含其他捆绑软件。如果使用CommonsChunkPlugin，则仅公共捆绑包将包含核心的webpack模块加载器帮助器功能，因此必须将其嵌入每个页面中。

new webpack.optimize.CommonsChunkPlugin({
  name: "common",
  minChunks: Infinity
})