根据环境将脚本文件添加到webpack中的HTML

Question

在捆绑我的应用程序进行生产时，我正在尝试将特定的js文件添加到我的index.html。我的webpack.common.js有以下文件被注入html：

  entry: {
    'polyfills': './src/polyfills.ts',
    'vendor': './src/vendor.ts',
    'app': './src/main.ts'
  },

在插件部分，我有：

new webpack.optimize.CommonsChunkPlugin({
      name: ['app', 'vendor', 'polyfills']
    }),

对于我的webpack.prod.js，我有以下输出：

output: {
    path: helpers.root('dist'),
    publicPath: '/',
    filename: '[name].[chunkhash].js',
    chunkFilename: '[id].chunk.js'
  },

一切正常。但是我不知道如何在插件中为生产指定一个额外的步骤，以便我可以获取额外的文件。

作为一种解决方法，我可以使用一个空文件替换生产中的实际内容 - 如下所示：

new webpack.NormalModuleReplacementPlugin(/\.\/folder\.dev/, '../folder/file.prod')

但我认为这是一种黑客攻击，我认为这不是最好的方法。我看了一下线程https://github.com/petehunt/webpack-howto/issues/46，这正是我想要实现的，但给出的解决方案对我不起作用。

我原本以为这可以通过html-webpack-plugin来实现，但是文档似乎没有显示出来（或者至少我可以在这里看到：https://www.npmjs.com/package/html-webpack-plugin或者这里：{{3} }）。

非常感谢任何帮助

Answer 1

由于我使用的是Backpack\CRUD\app\Http\Controllers\CrudFeatures\SaveActions，并且我的webpack-merge中列出了所有必填文件，我已通过添加webpack.common.js元素作为entry的一部分来解决此问题：

webpack.prod.js