Search code examples
node.jswebpackbabeljsbabel-loader

WebPack Babel ignore node_modules with exceptions


I have a node_module that is written in ES6 so causes issues when trying to view this in IE11. To solve this I setup babel so which solves the issue with IE11. But, babel seems to be trying to parse ALL node modules rather than just the one I want it to. How do I properly exclude all node modules bar flv.js? Note I found the exclusion syntax from this github thread

{
    test: /\.jsx?$/,
    exclude:/node_modules\/(?!flv.js)/,
    loader: 'babel-loader',
    query: {
        presets: ['es2015']
    }
},

WebPack output that makes me think its transpiling more than just flv.js

[BABEL] Note: The code generator has deoptimised the styling of "C:/TFS/.../node_modules/lodash/lodash.js" as it exceeds the max of "500KB".

[BABEL] Note: The code generator has deoptimised the styling of "C:/TFS/.../node_modules/angular-google-maps/dist/angular-google-maps.js" as it exceeds the max of "500KB".

[BABEL] Note: The code generator has deoptimised the styling of "C:/TFS/.../node_modules/angular/angular.js" as it exceeds the max of "500KB".

[BABEL] Note: The code generator has deoptimised the styling of "C:/TFS/...b/node_modules/angular-material/angular-material.js" as it exceeds the max of "500KB".


Solution

  • I managed to fix this, but the only way I managed was to transpile the node module using babel, like so (WebPack 3). Note for speed I ignore all node modules bar the offending one (flv.js)

    {
        test: /\.jsx?$/,
        exclude: /node_modules\/(?!flv.js)/,
        loader: 'babel-loader',
        query: {
            presets: ['es2015'],
            compact: true
        }
    },
    

    Add the following to package.json

    "babel-core": "6.23.0",
    "babel-loader": "7.1.4",
    "babel-preset-es2015": "6.24.1",
    "babel-preset-env": "1.6.1",