webpack babel-loader config is not transpiling npm modules.

I’m trying to get the babel-loader plugin to compile npm installed modules. Here is a simple example of my issue. https://github.com/johnwebbcole/vue-webpack-bable-issue

This is a fresh vue init webpack testwp and adding pretty-bytes which is written in ES6.

In order to run on IE 11 I need to transpile the node_modules/pretty-bytes/index.js file. The default config does not appear to do this.

My research indicates that the babel-loader plugin should be handling this, but different configurations to webpack.base.conf.js and .babelrc file have failed to fix the issue. Many issues seem to be with all of the node_modules files getting transpiled and it needing to be in the excludes list. Doing the opposite, adding it to the include array did not fix the issue.

pretty-bytes is still using arrow-functions.

Does anyone have some suggestions to get the node_modules files to be transpiled. Thanks!

[KagamiChan]

IMO published packages are assumed to be transpiled, for your case you may add this package in you babel-loader’s config here https://github.com/johnwebbcole/vue-webpack-bable-issue/blob/master/build/webpack.base.conf.js#L47

[johnwebbcole]

@KagamiChan I understand that has been typical in the past, but it appears that some module maintainers are deciding to leave that up to the bundler. See https://github.com/sindresorhus/ama/issues/446 or https://github.com/facebookincubator/create-react-app/issues/1125#issuecomment-264217076

Apparently this can no longer be assumed.

Also, as stated in the issue, adding a node_module to the include array does not fix the issue. If you believe this is a webpack bug, I’ll open a ticket there, but I was hoping this was a configuration issue. Since it appears that none of the node_module files are being transpiled by babel-loader without anything in the excludes: [] section, I was wondering if there was a configuration somewhere removing all of the node_module entries, even if they are in include.