Webpack Plugins System
Table of Contents
Tapable Plugin SystemSean introduces Tapable, the plugin system architecture of Webpack and the variable hooks that you can use to extend webpack.
Compiler & CompilationSean starts revealing the instances in Tapable beginning with the Compiler, which acts as a central dispatch within Webpack. The next instance review is Compilation, which is created by the Compiler and contains the dependency graph traversal algorithm.
Resolver & Module FactoriesThe Resolver instance asynchronously locates a module by its absolute path. Module Factories take successfully resolved requests and collect the source from the file to store the information in a module object.
Parser & TemplatesSean examines the Parser instance. The Parser takes a string of source, creates an Abstract Syntax Tree (AST), and finds the import and require statements to generate a list of dependencies that get added to the module. Then reviews Template instance provides data binding for module objects.
Compiler WalkthroughSean illustrates how Webpack utilizes the configuration file to build assets into a dependency graph.
Plugin System Code WalkthroughSean shows how instances interact with each other by walking through the Webpack source code.
Creating a Webpack PluginSean demonstrates how to develop a custom plugin for Webpack.
Plugin Instance HooksSean continues building a custom plugin to demonstrate the available hooks and features.
Isolating PluginsSean discusses how Webpack isolate your plugins so that you're passing the specific instance instead of the entire complier.
Config, Loaders & Babel
Creating a Custom LoaderPrompted by a student question, Sean demonstrates how to code a custom loader.
Configuring Babel for WebpackSean addresses students' questions about setting up Babel for modules and using Stage 0 Babel.
Webpack Dev Kit & Wrap UpAfter reviewing the Webpack Developer Kit project that aids in writing custom plugins and loaders on the fly, Sean wraps up Mastering Webpack course.