Webpack Exclude folder

Question

I'm shoving a rather large app through Webpack, which pulls from two library folders: thirdparty and node_modules. I've setup my rule for js files as such:

{
    test: /\.js$/,
    loader: 'babel-loader',
    include: [
      /src\/js\/client/
    ],
    exclude: [
      /node_modules/,
      /thirdparty/
    ]
  }

My hope was that webpack wouldn't parse any folders under either of those two directories, but I'm getting errors for libraries that are. For instance:

WARNING in ./~/durandal/js/system.js
51:8-15 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

WARNING in ./~/durandal/js/system.js
52:8-15 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

ERROR in ./~/durandal/js/system.js
Cannot statically analyse 'require(..., ...)' in line 278
 @ ./src/js/client/lib/durandal/overrides/views.js 2:0-37
 @ ./src/js/client/index.js

Am I misunderstanding the functionality of include/exclude, or is this a bug with Webpack?

Answer 1

The rules do not decide which files are being parsed by webpack, but instead they are only applied to the files which are included and also satisfy the condition. Even if you had no rule at all, webpack would still parse the same files since you imported them somewhere.

You can exclude modules from being bundled with the externals option. These externals will have to be present at runtime in some way (for example loaded in a <script> tag).

If you just want webpack not to parse the files, but still include them, you can configure module.noParse. But as the documentation says, they should not contain any imports.