1 views collected around this technical thread.
An in‑depth look at Webpack’s evolution from its 2012 debut to the modern version 5, covering each major release, core concepts like loaders, plugins, tree shaking, module federation, and code‑splitting, plus a practical code example and analysis of its bundled output.
This article provides an in‑depth overview of Webpack, covering its core concepts, entry and output settings, loaders, plugins, mode configurations, source‑map options, browser compatibility, and performance optimizations for both development and production environments.
This article explores Webpack's core build process—from startup and compilation to module handling and asset emission—clarifies the execution sequence of loaders versus plugins, explains loader chaining mechanics, and discusses practical optimization techniques for improving build speed and bundle size.
This comprehensive, step‑by‑step guide walks developers through Webpack’s core concepts, project setup, configuration files, development server with hot module replacement, essential loaders for CSS, images, Less, and Babel, plus optimization techniques such as JavaScript minification, CSS extraction, and output cleaning.
Covering webpack’s evolution from early module systems to modern code‑splitting, the article explains core concepts—entries, loaders, plugins, and chunks—then contrasts the deprecated CommonsChunkPlugin with the heuristic‑driven SplitChunksPlugin, offering configuration tips and best practices for efficient vendor, async, and route‑based bundling.
This article explains Webpack's bundling process, covering concepts like require and exports, and provides a step-by-step guide to implementing a basic Webpack setup for code bundling.
This article walks you through the fundamentals of abstract syntax trees, Babel, and Webpack's build process, then shows how to implement a simple mini‑webpack from scratch, install dependencies, configure the project, run the build, and verify the bundled output.
This article explains Rollup’s core principles, compares it with Webpack, introduces prerequisite concepts such as magic‑string, AST and scope chains, and walks through the complete build workflow—including parsing, dependency analysis, statement expansion, and final code generation—using concrete code examples and diagrams.
This article explains webpack’s core concept as a static module bundler, describes why bundling is needed for browser execution, details how webpack builds a dependency graph and loads modules, and walks through building a minimal custom bundler using Node and Babel to illustrate the underlying principles.
This article provides a comprehensive analysis of Webpack's core architecture, explaining its three-phase workflow (initialization, building, and generation), plugin system, and module handling mechanisms to help developers understand the underlying principles of this static module bundler.
This article explains what Webpack loaders are, their four classification types (pre, normal, inline, post), how to configure them with enforce, the inline loader prefixes, execution priority, the loader call chain, synchronous vs asynchronous handling, parameters, output, caching, and useful loader development tools.
An in‑depth tutorial explains webpack’s core concepts, build workflow, and practical scenarios—from single‑page apps and code splitting to npm package and server‑side rendering builds—plus guidance on creating custom loaders and plugins, empowering developers to master and extend this essential front‑end bundler.
This tutorial walks you through installing Node, npm, and nvm, setting up a simple Vue project, using Webpack to bundle JavaScript, CSS, and images with loaders, and demonstrates core commands and configuration steps for beginners.