Webpack

Plugins

• Webpack Summary - Webpack plugin for displaying a short summary at the end of the build process.

• add-asset-html-webpack-plugin - Add a JavaScript or CSS asset to the HTML generated by html-webpack-plugin.

• Webpack Extension Reloader - Webpack plugin to automatically reload browser extensions during development.

• React Refresh Webpack Plugin - Enable "Fast Refresh" (also previously known as Hot Reloading) for React components. (Tweet)

• ts-loader - TypeScript loader for webpack.

• Webpack External Import - Import() other chunks and modules from third parties, or other webpack builds themselves! At runtime.

• Speed Measure Plugin - See how fast (or not) your plugins and loaders are, so you can optimise your builds.

• react-imported-component - Bundler-independent solution for SSR-friendly code-splitting.

• Configs Webpack Plugin - Simplified AoT runtime config solution for your webpack builds.

• worker-plugin - Automatically bundle & compile Web Workers within Webpack.

Links

• Webpack: From apprentice to master book

• Awesome Webpack Perf - Curated list of webpack tools and plugins that help make the web faster.

• Building a Platform: Webpack and the Future by Sean Larkin (2018)

• Jetpack - Wraps webpack to create a smoother developer experience.

• Optimize your libraries with webpack - Using a library in your webpack project? Use these tips to make your bundle smaller.

• How to set up an advanced Webpack application (2019)

• inspectpack - Inspection tool for Webpack frontend JavaScript bundles.

• webpack autoconf - Tool to create personalized and optimized webpack.config.js

• Web Performance Optimization with webpack

• Building a Great Developer Experience: The Road to Parcel Version 2 (2019)

• Bundle Analyzer - Keep your webpack bundle optimized over time.

• @mixer/webpack-bundle-compare - Tool for comparing webpack bundle stats.

• Tobias Koppers's presentations