webpack|webpack 流程解析(1)(创建compiler之前)
前言
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
。这里用了两个包来提高运行效率,一个是回到webpack 回到webpack之后呢,就要开始创建import-local
,用于优先使用本地文件,另一个是v8-compile-cache
, 用来做 v8 的编译缓存优化。后续我们再聊这两个
compiler
实例啦,在这之前,其实也会有一点分支逻辑需要处理- 如果参数是一个数组,就创建MultiCompiler实例, 否则就创建一个Compiler的实例。
- 参数的校验和复制默认值
结语 【webpack|webpack 流程解析(1)(创建compiler之前)】在创建
compiler
对象之前 webpack 做的事情并不多。简单说就一句话,准备好参数。同时也有一些性能优化的手段,这些不在本次系列的讨论范围内,以后有时间再和大家分享推荐阅读
- 迅捷流程图制作软件的使用方法!
- Quartz|Quartz 源码解析(四) —— QuartzScheduler和Listener事件监听
- Java内存泄漏分析系列之二(jstack生成的Thread|Java内存泄漏分析系列之二:jstack生成的Thread Dump日志结构解析)
- [源码解析]|[源码解析] NVIDIA HugeCTR,GPU版本参数服务器---(3)
- Android系统启动之init.rc文件解析过程
- 小程序有哪些低成本获客手段——案例解析
- Python专栏|数据分析的常规流程
- Spring源码解析_属性赋值
- Android下的IO库-Okio源码解析(一)|Android下的IO库-Okio源码解析(一) 入门
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export