浅析webpack执行流程

bootstrap

const runCLI = async (args) => {
   
    try {
   
        // Create a new instance of the CLI object
        const cli = new WebpackCLI();
        await cli.run(args); // process.argv
    } catch (error) {
   
        logger.error(error);
        process.exit(2);
    }
};

webpack-cli.js

run -> loadCommandByName -> makeCommand -> bundleCommand -> createCompiler -> webpack函数

webpack.js

执行webpack函数，调用createCompiler返回compiler实例，执行compiler.run()方法

const webpack = /** @type {WebpackFunctionSingle & WebpackFunctionMulti} */ ((
	options,
	callback
) => {
   
	const create = () => {
   
		validateSchema(webpackOptionsSchema, options);
		/** @type {MultiCompiler|Compiler} */
		let compiler;
		let watch = false;
		/** @type {WatchOptions|WatchOptions[]} */
		let watchOptions;
		if (Array.isArray(options)) {
   
			/** @type {MultiCompiler} */
			compiler = createMultiCompiler(options);
			watch = options.some(options => options.watch);
			watchOptions = options.map(options => options.watchOptions || {
   });
		} else {
   
			/** @type {Compiler} */
			compiler = createCompiler(options);
			watch = options.watch;
			watchOptions = options.watchOptions || {
   };
		}
		return {
    compiler, watch, watchOptions };
	};
	if (callback) {
   
		try {
   
			const {
    compiler, watch, watchOptions } = create();
			if (watch) {
   
				compiler.watch(watchOptions, callback);
			} else {
   
				compiler.run((err, stats) => {
   
					compiler.close(err2 => {
   
						callback(err || err2, stats);
					});
				});
			}
			return compiler;
		} catch (err) {
   
			process.nextTick(() => callback(err));
			return null;
		}
	} else {
   
		const