Reputation: 4502
i am writing an npm module that runs the webpack compiler via node vs cli. i haven't tested my build function in awhile because it was working, but i recently ran it, and i cannot seem to get webpack to minify the bundle js. there have been some minor updates to my node, webpack, and some dependency versions, but no major upgrades & no breaking changes. i have been tearing my hair out trying to get this working again, and am reaching out to the community to spare me some sanity.
everything seems to compile fine, only the minification seemed to stop working. the optimization object was added as part of this troubleshooting, and was properly working fine without previously.
assuming the configuration looks ok, is there anything new in webpack or node that might be preventing this from working? i am stumped...
webpack config...
({
devtool: 'source-map',
entry: '/foo.js'
externals: [nodeExternals()],
mode: 'production',
target: 'web',
module: {
rules: [
{
test: /\.coffee$/,
use: [
{
loader: 'babel-loader'
},
{
loader: 'coffee-loader'
}
]
},
{
test: /\.js$/,
use: [
{
loader: 'babel-loader'
}
]
},
{
test: /\.(sass|css)$/,
use: [
{
loader: Extract.loader,
options: {
sourceMap: true
}
},
{
loader: 'css-loader',
options: {
sourceMap: true
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true
}
}
]
}
]
},
optimization: {
minimize: true,
noEmitOnErrors: true
},
output: {
filename: 'project_1.0.0.js',
path: '/build'
},
plugins: [
new Write,
new Extract({
filename: 'project_1.0.0.css'
})
],
resolve: {
modules: ['node_modules']
}
});
the problem was due to a .jss
extension for output.filename. updating it to just .js
fixed the issue. however it is still a strange outcome IMO. if the curiosity get to me, i might post another update with an explanation of webpack's behavior
Upvotes: 2
Views: 1679
Reputation: 4502
so in the process of mocking up the webpack config js object for the stack overflow post (i had some variables and functions for some of the values), i noticed that for the output.filename, i had project.jss
instead of project.js
. i confused it with the Extract plugin filename, and made a js/css hybrid extension... when i corrected it to .js, it now works again... which is great... but...
why would that break it? apparently you cannot just create a bundle with any extension you want... but why would it not throw an error, and why would minification be the only thing not working... these are more rhetorical questions, but the programmer in me wants to figure out why.. it seems like it would be extra work to do what it's doing.
@jayarjo thank you for your time to reply. im not sure i would have caught that had i not been in there formatting indentations to try your code. :)
Upvotes: 1
Reputation: 16726
I suspect that since you've manually added optimization
section you now need to define minimizer
property on it manually as well. Try something like this:
const TerserPlugin = require('terser-webpack-plugin');
// ...
{
optimization: {
minimize: true,
minimizer: [
new TerserPlugin({
terserOptions: {
parse: {
ecma: 8
},
compress: {
ecma: 5,
warnings: false,
comparisons: false,
inline: 2
},
mangle: {
safari10: true
},
output: {
ecma: 5,
comments: false,
ascii_only: true
}
},
parallel: true,
cache: true,
sourceMap: true
})
];
}
}
Upvotes: 0