webpack原理分析

webpack原理：使用webpack命令行是依赖于webpack-cli的，webpack-cli使用yargs作为脚手架来项目搭建，

webpack命令入口执行文件判断你是否下载了webpack-cli如果没有则提示下载webpack-cli，然后执行webpack-cli的入口文件。

webpack-cli做了什么？

1. 对webpack命令行的opitons进行分析，获取--config options对应的配置文件中的配置和命令行中指定的options结合生成一个options。
   • 判断运行的命令是否需要实例化为一个webpack：NON_COMPILATION_ARGS，因为并不是所有的命令都需要实例化一个webpack；
     • 不需要编译的命令有：

       const NON_COMPILATION_ARGS = ["init", "migrate", "serve", "generate-loader", "generate-plugin", "info"]; 
       return require("./utils/prompt-command")(NON_COMPILATION_CMD, ...process.argv);
       

       • 不需要编译的则会调用webpack-cli/${command}执行文件
     • 其他则需要编译

       ptions = require("./utils/convert-argv")(argv); // options = {entry,output,module,plugins,mode,externals等等}
       processOptions(options);  // 定义outputOptions，设置一些默认的exclude = ["node_modules", "bower_components", "components"];
       

2. 引入webpack将处理好的options传入，根据配置项进行编译和构建。

   const webpack = require("webpack");
   compiler = webpack(options);
   compiler.run((err, stats) => {
      if (compiler.close) {
       compiler.close(err2 => {
       compilerCallback(err || err2, stats);
      });
       }else {
           compilerCallback(err, stats);
       }
   });
   

webpack(options)做了什么？

肯定返回一个对象，对象有run方法。

compiler = new Compiler(options.context); //Compiler核心对象

Compiler类

class Compiler extends Tapable {

}

Tapable做了什么？