Unexpected token punc «(», expected punc when creating chunk from UglifyJS
Changing presets from es2015
to env
in .babelrc
fixed it for me. Babel changed babel-preset-es2015
into babel-preset-env
. Checkout this link - http://babeljs.io/env
{
"presets": [
- "es2015",
+ "env",
"react"
],
}
UglifyJs
does not support ES6. The error is very likely the method shorthand syntax. For example:
const obj = {
method() {
// ...
}
};
When it sees the opening parenthesis, it expected a colon instead, like this:
const obj = {
method: function() {
// ...
}
};
Is there a way to diagnosis this ?
It tells you the exact line in your chunk, so take a look at it. In the error message you posted it is:
[1.350b2d8a46d91e3c0911.chunk.js:20075,15]
^ ^ ^
filename line column
Then you can simply search your project for an identifier you see. If you don't want to search the entire project you can run webpack with the --display-chunks
flag. This will show which modules are included in the respective chunks, so you only need to look into those.
Instead of having to replace all the shorthand syntax, you can tell babel to transpile the shorthand syntax with the babel plugin transform-es2015-shorthand-properties.
For the record: Unit tests won't find such errors.
Unexpected token punc «(», expected punc «:»
The error is stating that it is expecting a colon rather than an opening parenthesis, so the problem is probably regarding the declaration of a function like this:
var foo = {
bar() {
console.log('Something');
}
}
and that will need to be changed to
var foo = {
bar: function() {
console.log('Something');
}
}