前言
compiler对象是一个全局单例,它负责把控整个webpack打包的构建流程。
本文将会介绍在 new compiler 之前,webpack做了什么
启动webpack
通常情况下,我们使用如下方式来启动webpack
// package.json
script: {
"start": "webpack"
}
webpack/bin
运行 npm run start
之后,会先进入 webpack/bin
下, webpack使用
isInstalled("webpack-cli")
来判断是否安装了cli
, 没安装会使用 yarn
或者 npm
帮你安装,最后会走到runCli
这个方法,核心代码就一句
require(path.resolve(path.dirname(pkgPath), pkg.bin[cli.binName]));
这里去读取 webpack-cli/bin/cli.js
。
webpack-cli/bin
webpack-cli/bin/cli.js
居然还要判断一下是否安装了 webpack
(上面不是判断过了), 如果没安装再帮你安装一下,然后就是实例化一个 webpack-cli
对象,执行实例的run
方法。
这里面代码就不细说了,其实就干了两件事:
- 拿到process.args 的参数,校验
- 合并参数,针对args的值给webpack的config增加对应的plugin
最后拿到了参数又调用了webpack
。
这里用了两个包来提高运行效率,一个是import-local
,用于优先使用本地文件,另一个是v8-compile-cache
, 用来做 v8 的编译缓存优化。后续我们再聊这两个
回到webpack
回到webpack之后呢,就要开始创建 compiler
实例啦,在这之前,其实也会有一点分支逻辑需要处理
- 如果参数是一个数组,就创建MultiCompiler实例, 否则就创建一个Compiler的实例。
- 参数的校验和复制默认值
一切都走完之后,就要开始创建 compiler 对象了。
结语
在创建 compiler
对象之前 webpack 做的事情并不多。简单说就一句话,准备好参数。同时也有一些性能优化的手段,这些不在本次系列的讨论范围内,以后有时间再和大家分享
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。