loader

  • loader 其实就是一个函数，会返回解决文件的后果
  • 当webpack解析资源时，会调用相应的loader 去解决 （从下往上，从右往左的顺序调用）
// context 文件内容// map SourceMap （传入SourceMap传入的相干数据）// meta 其余loader 传的参数module.exports = function (context,map,meta){    console.log(context    return context}

同步loader

  • 如果在同步loader中增加异步代码 程序会报错 The callback was already called（ 已调用回调 ）再次调用 就会报错
// 第一种module.exports = function (context,map,meta){    console.log(context)    return context}// 第二种  （如有下一个loader 须要解决能够采纳这种）module.exports = function (context,map,meta){    // 一个参数  如果有错误信息，就传错误信息  如果没有  就是null    // context 文件内容    // map SourceMap （传入SourceMap传入的相干数据） 持续传递 SourceMap    // meta 其余loader 传的参数    this.call(null, context, map, meta)}

异步loader

module.exports = function (context,map,meta){    const callback = this.async()        setTimeout(()=>{        callback(null, context, map, meta)        }, 1000)}

raw Loader

  • raw loader接管的context 是 Buffer 数据 （二进制数据）
  • 同步loader 和 异步loader 都能够
  • 须要 配置 module.exports.raw = true
module.exports = function loader(context,map,meta){    console.log(context)    return context}module.exports.raw = true

pitch Loader

  • pitch loader 中能够是异步loader 和 同步loader
  • 须要裸露一个 pitch办法
  • 当在 use 中设置多个loader时， 执行程序是 先执行 pitch loader pitch loader 执行完了会再执行一般loader
module.exports = function loader(context,map,meta){    console.log(context)    return context}module.exports.pitch = function (){    console.log(pitch)}

有什么总结不到位请大佬们帮忙补充下