4.1.1 优化 loader 配置
问题一：优化 loader 配置？
由于 Loader 对文件的转换操作很耗时，需要让尽可能少的文件被 Loader 处理。
在使用 Loader 时可以通过test、include、exclude三个配置项来命中 Loader 要应用规则的文件。 为了尽可能少的让文件被 Loader 处理，可以通过include去命中只有哪些文件需要被处理。
举例说明
以采用 ES6 的项目为例，在配置 babel-loader 时，可以这样：
module.exports = {
module: {
rules: [
{
// 如果项目源码中只有 js 文件就不要写成 /.jsx?/,
// babel-loader 支持缓存转换出的结果，通过 cacheDirectory 选项开启
use: ['babel-loader?cacheDirectory'],
// 只对项目根目录下的 src 目录中的文件采用 babel-loader
include: path.resolve(__dirname, 'src'),
},
]
},
};
你可以适当的调整项目的目录结构，以方便在配置 Loader 时通过include去缩小命中范围。
网友评论