了解Webpack：Loader定义了两次

Question

在GitHub的样板项目中，我发现了一些我还不懂的Webpack配置中的东西。

为什么下面的loader使用相同的测试定义两次？ 如果我删除其中的一个，应用程序不会按预期呈现。

{ test: /\.css$/, include: path.resolve('./src/app'), loaders: [ 
     'style-loader', 
     'css-loader', 
     'postcss-loader' 
    ] 
    }, 
    { test: /\.css$/, exclude: path.resolve('./src/app'), loaders: [ 
     'style-loader', 
     'css-loader' 
    ] 
    }, 

Answer 1

如果你看一下配置的控制器{include, exclude}选项，第一配置将用于你的源代码，第二个为所有其他人（供应商在node_modules/，全球模块，其他路径）。你可以应用相同的方法，比如说，用Babel等配置/跳过分析源代码。

我们这样做的原因是因为在注册表中发布的源已经被解析并转换为它们包的预部署的一部分，发布脚本，而我们的软件包仍在开发中。

在这里，您只希望您的源代码使用以PostCSS为目标的语法和表达式，而将通过NPM分发的语法和表达式视为标准CSS。您只解析它们来解决依赖关系并将它们转换为JS模块，完全跳过PostCSS解析器。