0

In "webpack.config.js", if we need use loaders, usually we will use "include" and "exclude" to include or exclude some files. The question here is why?

Since we already have "entry" in our "webpack.config.js", then webpack will transform all the related files into a target file "bundle.js" recursively. The loader will transform the related files. In other words, the loader already knows what files will be transformed. Then why do we still need "include" and "exclude" in each loader?

A regular webpack.config.js will include:

var path = require('path');

module.exports = {
  entry: [
    './index.js'
  ],
  output: {
    path: path.join(__dirname,"public"),
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      test: /\.js$/,
      loader: 'babel',
      exclude: /node_modules/,
      query: {
          presets: ['es2015']
        }
    }]
  }
};

Take the above for example, why do we need "exclude: /node_modules/"?

If I do not specify "include" or "exclude", what kind of ".js" files will be included? Does "include" or "exclude" work recursively?

Thanks

Derek

derek
  • 9,358
  • 11
  • 53
  • 94

1 Answers1

0

How "include" and "exclude" works in webpack loader

Simply put, entry.js will include all the imported/required files. But among these files, only a few of them need to be transformed. That is why "loader" introduces "include" and "exclude".

Community
  • 1
  • 1
derek
  • 9,358
  • 11
  • 53
  • 94