15-Analysis of Webpack source code of the Webpackoptionsapply module plug-in King

Overall after a bit of the process behind, found that the compiler module is really not suitable for a separate explanation, here continue to explain the following code:

New Webpackoptionsapply (). Process (options, compiler);

This line of code is very similar to the previous setup options default, but the complexity is not a single element at all.

This section can only be a simple look at the inside exactly how many things, after finishing the source code as follows:

"Use Strict"; Const Optionsapply= Require ("./optionsapply");// ... Massive plug-in introductionclass Webpackoptionsapply extends Optionsapply {constructor () {super ();        } process (options, compiler) {let externalsplugin; Compiler.outputpath=Options.output.path; Compiler.recordsinputpath= Options.recordsinputpath | |Options.recordspath; Compiler.recordsoutputpath= Options.recordsoutputpath | |Options.recordspath; Compiler.name=Options.name; Compiler.dependencies=options.dependencies; //set to Web in default parameter configuration        if(typeofOptions.target = = = "string") {let jsonptemplateplugin;            Let Nodesourceplugin;            Let Nodetargetplugin;            Let Nodetemplateplugin; Switch(options.target) { Case"Web": Jsonptemplateplugin= Require ("./jsonptemplateplugin"); Nodesourceplugin= Require ("./node/nodesourceplugin"); Compiler.apply (NewJsonptemplateplugin (options.output),NewFunctionmoduleplugin (options.output),NewNodesourceplugin (options.node),NewLoadertargetplugin (options.target));  Break; //Other case ...                default:                    Throw NewError ("Unsupported target" + Options.target + "'.")); }        } Else if(Options.target!==false) {options.target (compiler); } Else {            Throw NewError ("Unsupported target" + Options.target + "'.")); }        //options.output.library parameter Handling        if(Options.output.library | | options.output.libraryTarget!== "var") {/**/ }        //options.output.externals parameter Handling        if(options.externals) {/**/} let nosources;        Let Legacy;        Let modern;        Let comment; //options.devtool = Sourcemap | | Source-map        if(Options.devtool && (options.devtool.indexOf ("Sourcemap") >= 0 | | options.devtool.indexOf ("SOURCE-MAP") >= 0)) {/**/ }        //options.devtool = Sourcemap | | Source-map        Else if(Options.devtool && options.devtool.indexOf ("eval") >= 0) {/**/ }        //load the module and trigger the Entry-option event streamCompiler.apply (NewEntryoptionplugin ()); Compiler.applypluginsbailresult ("Entry-option", Options.context, options.entry); //Crazy Load PluginCompiler.apply (/**/ ); //options.performance parameter Handling        if(options.performance) {/**/ }        //Continue loading PluginsCompiler.apply (NewTemplatedpathplugin ()); Compiler.apply (NewRecordidsplugin ()); Compiler.apply (NewWarncasesensitivemodulesplugin ()); //options.performance parameter Handling        if(Options.cache) {/**/ }        //Trigger After-pluginsCompiler.applyplugins ("After-plugins", compiler); if(!compiler.inputfilesystem)Throw NewError ("No input filesystem provided"); //setting values for Compiler.resolversCompiler.resolvers.normal =Resolverfactory.createresolver (object.assign ({fileSystem:compiler.inputFileSystem}, Options.reso        Lve)); Compiler.resolvers.context=Resolverfactory.createresolver (object.assign ({fileSystem:compiler.inputFileSystem, Resolvetoc Ontext:true}, Options.resolve)); Compiler.resolvers.loader=Resolverfactory.createresolver (object.assign ({fileSystem:compiler.inputFileSystem}, Options.reso        Lveloader)); //triggering the After-resolvers event streamCompiler.applyplugins ("After-resolvers", compiler); returnoptions; }}module.exports= webpackoptionsapply;

This module eliminates the introduction of the parent class, the rest of the plug-in light on the top of the introduction of 34, is simply the King of plugins.

Omit the specific plug-in content, first look at the process, the parent is actually an interface, nothing:

"Use strict"; class Optionsapply {    = optionsapply;

Next is a single main method process, which summarizes the following processes:

1, according to options.target load the corresponding plug-in, if the configuration file is not configured this parameter, then the Webpackoptionsdefaulter module will be automatically initialized to the Web.

2, processing options.output.library, options.output.externals parameters

3, processing Options.devtool parameters

4. Load the Entryoptionplugin plugin and trigger the Entry-option event stream

5. Loading a large number of plugins

6, processing options.performance parameters

7, loading Templatepathplugin, Recordidplugin, Warncasesensitivemodulesplugin plug-in

8. Triggering the After-plugins event stream

9, set the value of the Compiler.resolvers

10. Triggering the After-resolvers event stream

If you divide by type, there are actually only two kinds: loading plug-ins, triggering event flow.

The triggering of the event stream is similar to the hook function in the Vue source code, which triggers the corresponding method to the specific stage, which is also used in the Java data structure source code.

Parameter processing in the module if the parameter is more commonly used, then the analysis, the rest of the less commonly used on the first skip, in order to explain in turn.

The options here are processed by the default parameter module, which is enriched as follows:

{    "Entry": "./input.js",    "Output": {        "FileName": "Output.js",        "Chunkfilename": "[Id].output.js",        "Library": "",        "Hotupdatefunction": "Webpackhotupdate",        "Jsonpfunction": "Webpackjsonp",        "Librarytarget": "var",        "Path": "D:\\workspace\\doc",        "Sourcemapfilename": "[File].map[query]",        "Hotupdatechunkfilename": "[id]. [Hash].hot-update.js],        "Hotupdatemainfilename": "[Hash].hot-update.json",        "Crossoriginloading":false,        "Chunkloadtimeout": 120000,        "Hashfunction": "MD5",        "Hashdigest": "Hex",        "Hashdigestlength": 20,        "Devtoollinetoline":false,        "Strictmoduleexceptionhandling":false    },    "Context": "D:\\workspace\\doc",    "Devtool":false,    "Cache":true,    "Target": "Web",    "Module": {        "Unknowncontextrequest": ".",        "Unknowncontextregexp":false,        "Unknowncontextrecursive":true,        "Unknowncontextcritical":true,        "Exprcontextrequest": ".",        "Exprcontextregexp":false,        "Exprcontextrecursive":true,        "Exprcontextcritical":true,        "Wrappedcontextregexp": {},        "Wrappedcontextrecursive":true,        "Wrappedcontextcritical":false,        "Strictexportpresence":false,        "Strictthiscontextonimports":false,        "Unsafecache":true    },    "Node": {        "Console":false,        "Process":true,        "Global":true,        "Buffer":true,        "Setimmediate":true,        "__filename": "Mock",        "__dirname": "Mock"    },    "Performance": {        "Maxassetsize": 250000,        "Maxentrypointsize": 250000,        "Hints":false    },    "Resolve": {        "Unsafecache":true,        "Modules": ["Node_modules"],        "Extensions": [". js", ". JSON"],        "Mainfiles": ["index"]],        "Aliasfields": ["Browser"],        "Mainfields": ["Browser", "module", "Main"],        "Cachewithcontext":false    },    "Resolveloader": {        "Unsafecache":true,        "Mainfields": ["loader", "main"],        "Extensions": [". js", ". JSON"],        "Mainfiles": ["index"]],        "Cachewithcontext":false    }}

Except for entry and Output.filename, the rest of the parameters are all filled up, because the subsequent process will detect the parameters, so this is listed first.

This section first, the specific content is explained in detail later.

15-Analysis of Webpack source code of the Webpackoptionsapply module plug-in King