webpack loaders中的include/exclude有什么用？

Question

在看webpack配置文件时候，其中loaders下，有时候配置include和exclude，这两个参数有什么用呢？如果不配置会有什么影响？

比如我经常看到有写exclude: /node_modules/的，这么做的目的何在？

{
    module: {
        loaders: [{
            test: /\.js$/,
            loader: 'babel-loader',
            include: [
                path.resolve(__dirname, "app/src"),
                path.resolve(__dirname, "app/test")
            ],
            exclude: /node_modules/
        }]
    }
}

Answer 1

• include 表示哪些目录中的 .js 文件需要进行 babel-loader

• exclude 表示哪些目录中的 .js 文件不要进行 babel-loader

https://webpack.js.org/configuration/

如果想要排除 node_modules 目录可以参考

http://stackoverflow.com/questions/33001237/webpack-not-excluding-node-modules

Answer 2

首先，不配置这两个属性你引入的模块还是会被打包。
但是，很多第三方模块是不需要再被处理的，比如jQuery,不需要再被babel处理，因为jQuery已经是es5，浏览器直接可以识别。这个时候，你不设置exclude，jQuery就会被处理，这样就增加了打包时间。
所以，设置好exclude和include可以优化打包时间。

Answer 3

打包的时候除掉/node_modules/下.js文件

Answer 4

webpack 中所有的loader 都可以拥有include和exclude属性。
exclude：排除不满足条件的文件夹（这样可以排除webpack查找不必要的文件）
include：需要被loader 处理的文件或文件夹

详情参考：https://github.com/webpack/do...

Answer 5

https://github.com/webpack/do...

这里有介绍：

exclude： 排除和过滤
include： 需要处理的