webpack-loader

什么是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将会不再执行。
}