ader 和 plugin 不同
2.1. loader是使wenbpack拥有加载和解析非js文件的能力
2.2. plugin 可以扩展webpack的功能,使得webpack更加灵活。可以在构建的过程中通过webpack的api改变输出的结果
webpack构建流程
3.1. 初始化参数,从配置文件和shell语句中读到的参数合并,得到最后的参数
3.2. 开始编译:用合并得到的参数初始化complier对象,加载是所有配置的插件,执行run方法开始编译
3.3. 确定入口,通过entry找到入口文件
3.4. 编译模块,从入口文件出发,调用所有配置的loader对模块进行解析翻译,在找到该模块依赖的模块进行处理
3.5. 完成模块编译,得到每个模块被翻译之后的最终的内容和依赖关系
3.6. 输出资源,根据入口和模块之间的依赖关系,组装成一个个包含多个模块的chunk,在把每个chunk转换成一个单独的文件加载到输出列表
3.7. 输出完成,确定输出的路径和文件名,把内容写到文件系统中
在以上过程中,webpack会在特定的时间点广播出特定的事件,插件在舰艇感兴趣的事件后会执行特定的逻辑,改变webpack的运行结果