异步模块加载

异步的模块被push进webpackJsonP中,是一个二维数组,[[0],{}],在webpack中会按顺序加载异步模块,加载方式是创建一个新的script标签,指定标签的src为对应chunkId

webpack通过魔法components来解决打包chunk名变化问题

截屏2021-12-24 上午12.18.51.png

AST解析工具—esprima

webpack基于nodejs,如何开启多核编译

happypack

loader解析ast树

截屏2021-12-24 上午12.40.21.png

截屏2021-12-24 上午12.45.42.png

webpack实现loader(同步、异步)

功能:实现一个将$index.js$代码中world单词替换的功能

这里只是简单的对content用正则替换,实际上通过ast抽象语法树解析会更快更有效

抽象语法树的工具,esprima、acron

—loader的调用顺序和use的顺序相反,比如下面的use会先调用replace再调用async-loader