Skip to main content

Loader

loader​

通过 IO 接口读取文件内容，之后调用 LoaderRunner 并将文件内容以 source 参数形式传递到 Loader 数组，source 数据在 Loader 数组内可能会经过若干次形态转换，最终以标准 JavaScript 代码提交给 Webpack 主流程，以此实现代码转译

函数签名：

module.exports = function (source, sourceMap?, data?) {
  return source;
};
  • 常用 loader 及其原理
    • 样式代码：css-loader/style-loader/less-loader，原理参考 https://juejin.cn/post/6944668149849522213
    • 资源处理：file-loader/url-loader/raw-loader
    • vue-loader(借助了其他 loader，template/script/css)
  • 调用链
    • 生命周期、pitch（类比事件捕获）
    • 例子：less-loader -> css-loader -> style-loader

自定义 loader【WIP】​