Webpack
webpack bundles JavaScript, CSS, HTML, WebAssembly and assets into optimized output for browsers, Node.js, Deno, Bun and other environments.
Is this your product? Claim it to edit the listing, post updates and answer questions. Prove it with an email address at the product's domain (the listing becomes Claimed), or put the LotsDirectory badge on your website (the listing becomes Verified, and its link to your website is followed while the badge is live).
Description
webpack bundles JavaScript, CSS, HTML, WebAssembly and assets into optimized output for browsers, Node.js, Deno, Bun and other environments.
About Webpack
What is Webpack?
Webpack is a static module bundler for modern JavaScript applications. It builds a dependency graph from entry points and combines modules into bundles.
What Webpack does
Since version 4.0.0, webpack does not require a configuration file. Core concepts on the page are Entry, Output, Loaders, Plugins, Mode, and Browser Compatibility. Out of the box it understands JavaScript, JSON, and WebAssembly, as well as CSS and HTML through Native CSS and Native HTML. Loaders process other file types. Plugins cover bundle optimization, asset management, and injection of environment variables. Mode can be development, production, or none. The default mode is production.
Who Webpack is for
Webpack is for JavaScript applications and for developers who bundle HTML, CSS, and JavaScript from the command-line.
How Webpack works
Install with npm install of webpack and webpack-cli. Point webpack at a page in webpack.config.js, or run npx webpack. Development mode leaves the page unminified and maps the bundle in browser devtools. Production mode minifies the page, the stylesheet, and the script. The default entry is ./src/index.js. The default output file is ./dist/main.js. The page says webpack parses the page and bundles what it references.
Key features
- Static module bundler that builds a dependency graph from one or more entry points.
- Since version 4.0.0, webpack does not require a configuration file.
- Entry defaults to ./src/index.js. Output defaults to ./dist/main.js.
- Understands JavaScript, JSON, WebAssembly, CSS, and HTML, including Native CSS and Native HTML.
- Loaders transform other files. The concepts page shows babel-loader as an example.
- Plugins include ProgressPlugin. Mode is development, production, or none.
- npm, webpack-cli, and npx webpack, with development and production mode.
- Donations and sponsorship support office hours and documentation.
Facts from js.org, checked 14 October 2026
- The install line is npm install of webpack and webpack-cli.
- The page says no loader and no plugin are required. Webpack parses the page and bundles what it references.
- The concepts page lists Loaders and Plugins as core concepts.
- Donations and sponsorship are described as support for office hours and documentation.
Written from Webpack's own website (Homepage, Docs). The maker can claim this listing to edit it.
Categories
Frequently asked questions
What is webpack?
Webpack is a static module bundler for modern JavaScript applications. It builds a dependency graph and combines modules into bundles that are static assets.
Does it need a config file?
Since version 4.0.0, webpack does not require a configuration file. The default entry is ./src/index.js and the default output is ./dist/main.js. A webpack.config.js can set a different entry.
What are development and production modes?
Development leaves the page and the stylesheet unminified and maps the bundle in browser devtools. Production minifies the page, the stylesheet, and the script. The concepts page says the default mode is production, and none is also a mode value.
What file types does it understand?
JavaScript, JSON, and WebAssembly, as well as CSS and HTML through Native CSS and Native HTML. Loaders process other types. The concepts page uses babel-loader as an example.