webpack中loader调用过程

248 阅读1分钟

loader(加载器)的调用过程如下(以处理.css文件为例):

1.webpack 默认只能打包处理.js文件,处理不了其它后缀的文件

2.由于前端项目中包含了其它后缀文件,当处理不了这些文件时,会查找webpack.config.js这个配置文件,看module.rules数组中,是否配置了对应的loader加载器

3.webpack把.css文件先转交给最后一个loader进行处理(转交给css-loader)

4.当css-loader处理完毕后,会把处理结果转交下一个loader(转交给style-loader)

5.当style-loader处理完毕后,发现没有下一个loader了,于是就把处理结果转交给webpack

6.webpack把style-loader处理的结果,合并到/dist/main.js(默认)中,最终生成打包好的文件