Question

我是webpack的新手。我想输出相同的文件2次，一个普通的bundle（file.js）和一个名称中有一个哈希的文件（file.12345.js）。像这样：

├── file.js
├── dist/ 
│   └── file.js
│   └── file.12345.js

但是，据我所知，您只能在配置文件中定义1个输出。这不起作用，因为webpack需要一个字符串作为文件名：

output: {
    path: path.resolve(__dirname, './dist'),
    filename: ['./[name].js', './[name].[chunkhash].js']
}

如何输出两者？

为什么我要这个/这是什么问题？
我在heroku上托管我的代码。在暂存时，我想要生产文件.12345.js上的file.js。但是，在heroku上推广升级到无需额外构建 - 它只是复制代码。不能为它运行另一个脚本。

为什么不总是使用file.12345.js？
当然我也可以使用插件将最新的文件.12345.js输入到我的html文档中。但是，我无法访问html，因为我们正在使用工具来构建网站。

Answer 1

解决方案1 

使用webpack，您可以返回一系列配置。所以在你的情况下，你可以这样做：

function createConfig(fileName) {
 return {
   output: {
      filename
   }
   // all other props
 }
}

module.exports = [
   createConfig('./[name].js'),
   createConfig('./[name].[chunkhash].js')
]

所以我们在这里做的是创建一个返回webpack配置的函数。文件名作为参数传递。因此可以动态设置文件名。

我们导出一组webpack配置，这些配置是通过调用createConfig函数创建的。作为参数，我们传入我们想要的文件名。

一个缺点是，随着每个配置的返回，一切都会被重新编译。（所以它需要两倍的时间）。

解决方案2

使用copy-webpack-plugin复制（重命名）您的文件

https://github.com/webpack-contrib/copy-webpack-plugin

例如，让webpack为您创建file.js，并将copy-webpack-plugin添加到您的配置中，如下所示：

plugins: [
   new CopyWebpackPlugin([
   {
      from: './dist/file.js'
      to: './dist/[name].[hash].[ext]',
      toType: 'template'
   }
  ], options)
]

Webpack：2个输入1个条目？

1 个答案: