# Webpack
Confidence: high
Last verified: 2026-05-22
Generation: ai_assisted


## TL;DR

Webpack is a module bundler that transforms frontend assets (JS, CSS, images) into optimized bundles. Entry point → dependency graph → loaders (transform files) → plugins (optimize output) → bundles. Introduced code splitting and hot module replacement to mainstream JavaScript.

## Core Explanation

Loaders: `babel-loader` (transpile), `css-loader`, `file-loader`. Plugins: `HtmlWebpackPlugin`, `MiniCssExtractPlugin`, `TerserPlugin` (minification). Webpack 5 (2020): module federation (sharing modules across applications). Newer alternatives: Vite (ESM-native, faster dev server), esbuild (Go, 10-100x faster), Turbopack (Rust, Next.js).

## Further Reading

- [Webpack Documentation](https://webpack.js.org/)