乐趣区

关于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

这里用了两个包来进步运行效率,一个是 import-local, 用于优先应用本地文件,另一个是 v8-compile-cache, 用来做 v8 的编译缓存优化。后续咱们再聊这两个

回到 webpack

回到 webpack 之后呢,就要开始创立 compiler 实例啦,在这之前,其实也会有一点分支逻辑须要解决

  • 如果参数是一个数组,就创立 MultiCompiler 实例, 否则就创立一个 Compiler 的实例。
  • 参数的校验和复制默认值

所有都走完之后,就要开始创立 compiler 对象了。

结语

在创立 compiler 对象之前 webpack 做的事件并不多。简略说就一句话,筹备好参数。同时也有一些性能优化的伎俩,这些不在本次系列的探讨范畴内,当前有工夫再和大家分享

退出移动版