【webpack】loader

loader的类型

loader的类型主要分为：

post(后置)+inline(内联)+normal(正常)+pre(前置)

可以简单的记为 后脸挣钱,loader类型不一样，执行的顺序也不一样

增加参数 enforce, 设置loader类型(post, pre)，不设置enforce 默认为normal loader.

而内联loader的用法比较特殊

let title = require('inline-loader!inline-loader2!./title.js')
// 用 ！将loader隔开

输入图片说明

比如 a!b!c!module, 正常调用顺序应该是 c、b、a，但是真正调用顺序是 a(pitch)、b(pitch)、c(pitch)、c、b、a,如果其中任何一个 pitching loader 返回了值就相当于在它以及它右边的 loader 已经执行完毕

loader其实就是一个函数，里面的参数表示源码

function loader(source) {
    // 如果loader里面有异步逻辑，我们可以使用const cb = this.async()来处理这个逻辑
    return source
}
module.exports = loader

说白了loader就是根据顺序，对源代码进行自己的处理逻辑之后，交给下一个loader处理