JavaScript Bundlers

Features ? Blazing fast bundle times - multicore compilation, and a filesystem cache for fast rebuilds even after a restart. ? Out of the box support for JS, CSS, HTML, file assets, and


Webpack Bundle Analyzer Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap What is this for? Just take a look at this demo: This module will help you: Re


Microbundle The zero-configuration bundler for tiny modules, powered by Rollup. ✨ Features: One dependency to bundle your library using only a package.json Support for ESnext & async/await (v


Shipit Shipit is an automation engine and a deployment tool written for node / iojs. Shipit was built to be a Capistrano alternative for people who don't know ruby, or who experienced some issues with it. If you want to


Introduction Laravel Mix provides a clean, fluent API for defining basic webpack build steps for your applications. Mix supports several common CSS an


webpack is a module bundler. webpack takes modules with dependencies and generates static assets representing those modules. Awesome Webpack A curated list of awesome Webpack resources, libraries, tools and

Siddharth Kshetrapal
Keep your bundle size in check


Keep your bundle size in check Setup npm install bundlesize --save-dev # or yarn add bundlesize --dev Usage Add it to your scripts in package.json "scripts": { "test"


A bundler that does it right FuseBox on slack FUSEBOX v4 is here A re-write of FuseBox with Major Improvements is available in the @next release. Please help test it and contrubite

CSS Loader


css-loader The css-loader interprets @import and url() like import/require() and will resolve them. Getting Started ⚠ To use css-loader, [email protected] is


Optimize your libraries with webpack Using a library in your webpack project? Use these tips to make your bundle smaller! Want to add a tip? See the contribution guide and make a pull request! Contents: async async-es


webpack-chain Use a chaining API to generate and simplify the modification of Webpack 2 and 3 configurations. This documentation corresponds to v4 of webpack-chain. v3 docs v2 docs v1 docs Note: while webpack-chain is

Pack JS code fast & easy


Fastpack Pack JS code into a single bundle fast & easy. Why? Because JavaScript builds should be faster! Here is an example benchmark of bundling ~1600 modules together. Fastpack Parcel


preload-webpack-plugin A webpack plugin for automatically wiring up asynchronous (and other types) of JavaScript chunks using <link rel='preload'>. This helps with lazy-loading. Note: This is an extension plugin for


lqip-loader: low quality images placeholders for webpack demo npm install --save-dev lqip-loader Generating Base64 & dominant colours palette for a jpeg image imported in your JS bundle: PS: The large


Splittable Splittable is a next-generation module bundler for JavaScript with support for super simple code splitting. ES6 modules. CommonJS modules (with some caveats). extremely efficient packing of modules. dead

Fedor Indutny
CommonJS Tree Shaker plugin for WebPack


CommonJS Tree Shaker plugin for WebPack ALPHA TESTING Please file an issue if anything is broken. NOTE: webpack version 3 may be needed in order to run this. Why? There are vast amount of CommonJS modules out the


ESL (Enterprise Standard Loader) ESL是一个浏览器端、符合AMD的标准加载器,适合用于现代Web浏览器端应用的入口与模块管理。 ESL is a browser-only, amd-compliant module loader. In modern web app


Bonsai Trim your javascript dependency tree. Users guide The quickest way to get started is to generate a Webpack stats file, and then drag and drop it into See more do


Webpack Simple Starter A simple webpack starter without framework (Like Vue, React, Angular, etc.). This project is inspired from vue-cli webpack project Getting Started First, install the modules that the project nee


cache-loader The cache-loader allow to Caches the result of following loaders on disk (default) or in the database. Getting Started To begin, you'll need to install cache-loader: npm install --save

Arthur Buldauskas
:sparkles: WASM webpack loader


WASM Binary Module loader for Webpack A simple .wasm binary file loader for Webpack. Import your wasm modules directly into your bundle as Constructors which return WebAssembly.Instance. This avoids the need to use fetch and p


TypeScript Module Loader Features Supports node <file> usage Supports ESM --loader usage† Supports --require hook usage Optional configuration file fo


preact-starter Webpack3 boilerplate for building SPA / PWA / offline front-end apps with ⚛️ Preact Using preact-starter will kickstart your next application! ? It is designed to fit the "90% use-case" for


Note: This only works on Webpack 4, if you're still on Webpack 3 or below please use version 1.x CDN extension for the HTML Webpack Plugin Enhances html-webpack-plugin functionality by allowing you to specify the modules you

Webpack plugin for enabling Subresource Integrity.


webpack-subresource-integrity Webpack plugin for enabling Subresource Integrity. Subresource Integrity (SRI) is a security feature that enables browsers to verify that files they fetch (for example, from a CDN) are deliv

:fire: Hot reload webpack bundles on the server


Webpack Hot Server Middleware Webpack Hot Server Middleware is designed to be used in conjunction with webpack-dev-middleware (and optionally webpack-hot-middleware) to hot update Webpack bundles on the server. Wh

Addy Osmani
A Webpack plugin for Lighthouse


Webpack Lighthouse Plugin This plugin allows you to run Lighthouse from a Webpack build. Installation npm install --save-dev webpack-lighthouse-plugin Setup In webpack.config.js: const WebpackLightho


Webpack Deadcode Plugin Webpack plugin to detect unused files and unused exports in used files Installation Via npm: $ npm install webpack-deadcode-plugin --save-dev Via yarn: $ yarn add -D webpack-deadco


electrify What is Electrify? Electrify is an webpack visualizer tool for visualizing and analyzing Webpack bundles, it is a UI tool based on D3.js for visualizing the module tree of electrode + webpack project bundl


Demopack Fire up a pre-configured, live reloading Webpack server that supports React, (S)CSS and files for quick demos and tutorials. Like create-react-app, but without needing to create a new project and npm install all the thi


react-hot-loader-loader A Webpack Loader that automatically inserts react-hot-loader to your app, without any changes in your app code. All it takes is a simple regex to indicate where your "App" Components are. This module does


[deprecated] AoT loader ⚠️ This project is deprecated ⚠️ Project is deprecated as AoT mode will be a default soon, we suggest using ngc until then as the official offering from Angular. This loader allow

Preview npm publish changes.


Publish Diff View diffs of what you will publish to npm before you really do! Publishing a package from a local repository runs the risk of last minute human mistakes like: deletions mutations additions to the file

Sindre Sorhus
Dynamically add an asset to the Webpack graph


add-asset-webpack-plugin Dynamically add an asset to the webpack graph Install $ npm install add-asset-webpack-plugin Usage const AddAssetPlugin = require('add-asset-webpack-plugin'); module.expo


SVG Sprite Webpack Plugin Description A webpack plugin/loader to make SVG &lt;use&gt;-based icon systems easy in Webpack. Creates an SVG sprite with &lt;symbol&gt; tags from imported SVG files, and returns a URL to

Travis Arnold
Sketch to SVG JSON loader module for webpack


sketch-to-svg-json-loader Import Sketch files as SVG JSON data through Webpack. Inspired by @david.gilbertson's wonderful article on icons as react components. Install yarn add sketch-to-svg-json-loader --dev npm


bundler-performance-benchmark Why Showing numbers means nothing if you can't back it up. This is a joint effort between all bundlers involved to create a fair and unbiased set of benchmarks for build and size performan

A HTML based reporter for webpack dev server


Electrode Webpack Reporter An HTML based reporter for webpack-dev-server. Adds a new route /reporter to your webpack-dev-server HTTP server. Usage const WebpackReporter = require("electrode-webpack-reporter");

Sindre Sorhus
Simplified `NODE_ENV` handling with webpack


node-env-webpack-plugin Simplified NODE_ENV handling with webpack Install $ npm install node-env-webpack-plugin Usage 'use strict'; const path = require('path'); + const NodeEnvPlugin = requir


blrplt Javascript Write ES6+ or React Javascript and get it linted with the AirBnb eslint config. Styles All your styles get autoprefixed and sass compiled. It even has some lovely opinionated stylelint con

TJ Holowaychuk
Webpack visualizer as a Neutrino preset


neutrino-preset-visualizer Webpack visualizer as a Neutrino preset to view where space is allocated. Outputs ./build/stats.html. Installation Grab the preset: $ yarn add -D neutrino-preset-visualizer Add it to yo


webpack-proxy Install yarn add webpack-proxy Usage Let's say you want to use buble-loader, you can just add it to your webpack config without installing buble-loader and buble, since webpack-prox

Sam Zhao
CLI tool to generate webpack.config.js


wepack-config CLI tool to generate webpack configuration file (webpack.config.js) for you. Usage npm i -g create-webpack-config webpack-config init After that, you can run npm i npm start Why Peopl

Sencha, Inc
Ext JS Dynamic Package Loader


package-loader Ext JS Dynamic Package Loader Requirements This package is used by Ext JS applications and Sencha Cmd 6.5 Install Sencha Cmd Download Sencha Ext JS. We recommend extracting Ext JS into a "sencha-s

bundle and `require` a file


? You can help the author become a full-time open-source maintainer by sponsoring him on GitHub. bundle-require Use Case Projects like Vite need to l


webpack-codemods JSCodeshift Codemods to automatically convert webpack config from v1 to v2 ? ? ? ? ? ? This repository is deprecated in favor of


Proxy Local Assets Have you ever been asked to make CSS or JS changes to a live website that you have no back-end access to? If so, you know how much of a pain in the ass it can be. This is a simple BrowserSync-based Gulpfile th


EMP - Micro Frontends solution Base on Webpack 5 & Module Federation English | 简体中文 Projects Project NPM Info @efox/emp-cli CLI @efox/emp-tsconfig Typ

Even Stensberg
Webpack Plugin for extended bundle info


webpack-plugin-extended-network webpack plugin for analyzing how your bundle performs in a browser. This plugin is experimental and the API might change in the future. The plugin uses chrome-protocol and works with code-splitting

Luuk de Gram
Experimental wasm linker


zwld Experimental linker for wasm object files. The idea is to implement a linker that stays close to wasm-ld in regards to features so that one day t

hiroki osame
Webpack plugin to tree-shake and minify JSON modules


webpack-json-access-optimizer Optimize JSON modules that are referenced via accessor function. For example, i18n locale JSONs. Features Tree shaking R


Sushi Hub restaurant page This is a Sushi Hub restaurant web page, you'll find ancient Japanese foods in our specials section Note: Only large screens


To-do is a web app that helps to organize your day to day activities. It lists all the activities that you need to be completed and allows you to mark them as complete or not. It's a minimalistic website built using JavaScript ES6, Webpack and CSS.


Todo-list-webpack This website Todo-list-webpack provides users a convenient way to keep track of their todos. Built With HTML CSS JavaScript Linters


Leaderboard This is a Webpack Project Leaderboard and use API to add your game score and see a list of the other scores What I did in this project: Se

Vivek Patel
A boilerplate code to build a chrome extension with react and webpack.


Chrome Extension with React.js Boilerplate Boilerplate for your chrome extension with react.js and webpack Background Creating a file structure for de


Vue 3 SSR with Webpack 4 HMR Play with it right in the browser! Features Hot reloading for everything inside src folder Production-ready build Integra

hiroki osame
Utility functions to test Webpack loaders/plugins


webpack-test-utils Utility functions to test Webpack loaders/plugins Features In-memory builds Uses an in-memory file-system for faster builds that do