淺析webpack源碼之processOptions處理Options以及入口函數（三）

咱們打開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( /*...*/ );

能夠主要分爲如下幾塊：

一、工具模塊引入

二、對配置對象進行錯誤檢測

三、分多配置或單配置進行處理

四、執行回調函數

五、在webpack函數上掛載引入的模塊

六、輸出一些插件