什么是loader?
loader就是一个工具。可以将各种文件转化为webpack能够识别的文件。
loader执行顺序
同级别执行顺序是:从下到上、从右向左
不同级别优先级:pre(前置)>normal(普通)>inline(行内)>post (后置)
{
loader:'xxx',
enforce:'pre'
},
{
loader:'xxx',
// enforce:'normal' 不写即代表normal loader
},
{
loader:'xxx',
enforce:'post'
},
loader 分类
同步loader
有两种定义方式
module.exports = function (content){
console.log(content)
return content
}
module.exports = function () {
// 1 错误信息返回
// 2 处理后的内容
// 3 source-map信息
// 4 给其他loader传递的信息
this.callback(null,content,map,mate)
}
异步loader
module.exports = function () {
const callback = async();
setTimeout(() => {
callback(null,content,map,mate)
},1000)
}
raw-loader
module.exports = function (content) {
console.log(content) // content为buffer格式的文件,一般用与处理字体、图片、等。
return content
}
module.exports.raw = true;
pitch-loader
module.exports = function (content){
return content
}
module.exports.pitch = function(){
// pitch方法的执行顺序与loader执行顺序正好相反,
// 执行完所有的pitch后继续按照正常loader顺序执行。
// 如果此方法里有return方法就会形成熔断机制,
// return之前的loader将会不再执行。
}