Webpack's UglifyJsPlugin throws error with Node modules containing let

Question

This is the relevant code (I'm using Vue.js' Webpack official template):

.babelrc:

"presets": [
  "babel-preset-es2015",
  "babel-preset-stage-2",
]

webpack.prod.config.js

new webpack.optimize.UglifyJsPlugin({
  compress: {
    warnings: false,
    drop_console: shouldDropConsole
  },
  sourceMap: true
}),

This is the error I get when I do npm run build:

ERROR in static/js/vendor.a6271913414e87e123c2.js from UglifyJs Unexpected token: name (_months) [./node_modules/calendar-js/index.js:56,0][static/js/vendor.a6271913414e87e123c2.js:90602,6]

This is the offending line:

let _months = MONTHS;

(If I replace all the let's to vars the project is built without problems. And the const's don't seem to bother Webpack/UglifyJS.)

Do I need to configure something so that Webpack/UglifyJS build node modules containing let's? (The let's in my actual project don't give me problems.)

Answer 1

This could be because you might be using an older version of node which does not support es6 syntax.

let, const, arrow functions etc. are part of es6 syntax. To know more follow this link http://es6-features.org/

You might need the older version of node for your other projects so install nvm. NVM is a node version manager which will help you to switch between node versions easily. Follow the link for documentation and installation process https://github.com/creationix/nvm

Node v6+ supports ES6 syntax try upgrading to that.

UPDATE

On the comments of this answer, it's confirmed that it was not a version issue and got resolved by following this GitHub issue thread https://github.com/joeeames/WebpackFundamentalsCourse/issues/3.

Peace!