Organize + Automate + Deploy = Webpack Chapter 16Now, write the following in build.js before the Webpack command:
const configs = [
{
plugins: [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
sourceMap: true
})
]
},
{
plugins: []
}
]You now have an array with two different configurations, one with the plugin required to
minify the file and one without it. If you merge each of them with the configuration inside
the webpack.prod.conf.js, you will obtain a different result.
To merge the two configurations, we will use the webpack-merge package. Add the
following line to the top of the file:
var merge = require('webpack-merge')Then, modify the first line of the Webpack command to the following:
configs.map(c => webpack(merge(webpackConfig, c), function (err, stats) {
...This will launch as many different merged configurations as we specify in the configs
array.
You can launch the npm run build command now, but the problem is that the files will
have the same name. Cut the output property from the webpack.prod.conf.js and paste
it in the config array, which should now look like this:
const configs = [
{
output: {
path: <whatever is your path>,
filename: 'myFilename.min.js'),
<other options you may have>
},
plugins: [