码迷,mamicode.com
首页 > Web开发 > 详细

webpack打包

时间:2017-12-07 17:13:53      阅读:246      评论:0      收藏:0      [点我收藏+]

标签:led   查询   uil   依赖   his   load   create   let   set   

webpack创建compiler实例,如果options是数组,则创建多个compiler;

初始化compiler,为compiler添加上下文context和options,初始化基本插件;

compiler调用run,run内调用compile方法,开始编译;

compile内创建compilation对象,并将this传入,compilation就包含了对compiler的引用;

compiler调用addEntry,addEntry调用_addModuleChain();

_addModuleChain查询合适的工厂函数开始创建模板,并将其加入module链当中,调用buildModule();

buildModule是核心,包括module.js内调用的build(),build调用doBuild来查找合适的loader,并在回调函数内解析源文件,生成AST,来记录源码间的依赖行为

buildModule创建模板,根据depedencies创建依赖数组(期间调用addModuleDepedencies);

module创建完毕;

compiler调用seal,添加hash,调用addModule、addChunk(将module装入chunk)对chunk和module开始封装;

compilation调用createChunkAsset,开始生成最终代码;

createChunkAsset内根据不同的module,调用MainModule.render,chunkTemplate.render进行进一步处理

MainModule.render,chunkTemplate.render内调用moduleTemplate.render

moduleTemplate.render调用module.source

module.source将生成好的代码放入assets中

Compiler.emitAssets将compilation的assets输出到目录中

 

webpack打包

标签:led   查询   uil   依赖   his   load   create   let   set   

原文地址:http://www.cnblogs.com/yanze/p/7999550.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!