我们打开 bin/cli.js 根据上次所返回的 Options
processOptions(options) 这个因为有了上次的基础，比较容易读了, 大体逻辑是这样的
先定义一个 outputOptions 空对象
同上次的 ifArg 一个逻辑，argv 还是一个
function ifArg(name, fn, init) {
if (Array.isArray(argv[name])) {
if (init) init();
argv[name].forEach(fn);
} else if (typeof argv[name] !== “undefined”) {
if (init) init();
fn(argv[name], -1);
}
}
目前的方式只有一个满足 info-verbosity 如果满足的会执行 fn, init 一系列函数
ifArg(“info-verbosity”, function(value) {
outputOptions.infoVerbosity = value;
});
这个函数直接结果是
outputOptions.infoVerbosity = ‘info’;
outputOptions.infoVerbosity 的影响是打 log
比如如果 watch 满足的话
if (outputOptions.infoVerbosity !== “none”){
console.log(“\nwebpack is watching the files…\n”);
}
当你 npm run dev 的时候就会在页面上出现
webpack is watching the files…
这样一句话了
其他逻辑类此，通过调用 ifArg 对 outputOptions 对象添加数据，然后根据属性的值来打不同的 log 这就是 processOptions 的函数所做的事情
这些都不影响主进程
最重要的是里面这一句
const webpack = require(“webpack”);
let compiler;
compiler = webpack(options);
// …
compiler.run(compilerCallback);
拉开了 webpack 的序幕
那么问题来了 webpack 从那里引进来的
なに（纳尼）经过一番搜索在 webpack/lib/webpack.js 先不纠结为什么找到了 lib 下我们继续读
打开 webpack.js
const Compiler = require(“./Compiler”);
// … 模块引入
function webpack(options, callback) {
// 错误检测
const webpackOptionsValidationErrors = validateSchema(webpackOptionsSchema, options);
if(webpackOptionsValidationErrors.length) {
throw new WebpackOptionsValidationError(webpackOptionsValidationErrors);
}
let compiler;
// 多配置
if(Array.isArray(options)) {
compiler = new MultiCompiler(options.map(options => webpack(options)));
}
// 单配置
else if(typeof options === “object”) {/*…*/}
else {
throw new Error(“Invalid argument: options”);
}
if(callback) {/*…*/}
return compiler;
}
exports = module.exports = webpack;
webpack.WebpackOptionsDefaulter = WebpackOptionsDefaulter;
// … 属性挂载
function exportPlugins(/*…*/)
exportPlugins(/*…*/);
exportPlugins(/*…*/);
可以主要分为以下几块：
1、工具模块引入
2、对配置对象进行错误检测
3、分多配置或单配置进行处理
4、执行回调函数
5、在 webpack 函数上挂载引入的模块
6、输出一些插件