JavaScript Webpack

Open-source JavaScript projects categorized as Webpack

Top 23 JavaScript Webpack Projects

  • GitHub repo webpack

    A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

    Project mention: React on Rails: Building a Simple App | dev.to | 2021-06-22

    Webpacker is one of the most widely used static module bundlers for JavaScript applications. Because of that, it’s the perfect match to incorporate the React capabilities into an existing application.

  • GitHub repo JHipster

    JHipster is a development platform to quickly generate, develop, & deploy modern web applications & microservice architectures.

    Project mention: What's everyone working on this week (24/2021)? | reddit.com/r/rust | 2021-06-13

    Mostly KDash and if possible progress on a JHipster blueprint for Rust microservices

  • GitHub repo electron-react-boilerplate

    A Foundation for Scalable Cross-Platform Apps

    Project mention: Any official tool to create electron project with Typescript and ReactJS? | reddit.com/r/electronjs | 2021-06-05
  • GitHub repo react-loadable

    :hourglass_flowing_sand: A higher order component for loading components with promises.

    Project mention: React Lazy Loading; does it slow down your app? | reddit.com/r/reactjs | 2021-04-18

    Preloading is possible with react-loadable: https://github.com/jamiebuilds/react-loadable#preloading

  • GitHub repo electron-vue

    An Electron & Vue.js quick start boilerplate with vue-cli scaffolding, common Vue plugins, electron-packager/electron-builder, unit/e2e testing, vue-devtools, and webpack.

    Project mention: Best Ui Frameworkslibraries To Use With Electron | reddit.com/r/electronjs | 2021-02-28
  • GitHub repo webpack-dashboard

    A CLI dashboard for webpack dev server

  • GitHub repo front-end-guide

    📚 Study guide and introduction to the modern front end stack.

    Project mention: Front-end guide from Grab | reddit.com/r/u_hasanlock | 2021-03-02
  • GitHub repo webpack-bundle-analyzer

    Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap

    Project mention: How to get started with improving site performance | dev.to | 2021-06-17

    One of the first tools that I started using is webpack-bundle-analyzer. It generates a report of the output of your webpack build which visualises the filesize of your JavaScript files and what libraries are included in each file. Here is an example screenshot:

  • GitHub repo razzle

    ✨ Create server-rendered universal JavaScript applications with no configuration

    Project mention: Why use Next.js + Strapi? | dev.to | 2021-05-06

    Within the React ecosystem there are other ways to achieve the same goal, either with After.js, Razzle or React-SSR.

  • GitHub repo html-webpack-plugin

    Simplifies creation of HTML files to serve your webpack bundles

    Project mention: Support runtime data injection to a static markup produced by HtmlWebpackPlugin, using EJS | dev.to | 2021-04-23

    Let’s say you use Webpack HtmlWebpackPlugin to produce a static HTML file from a template you have, but sometimes that’s not enough. This page that you’re producing is that main static page for your SPA (Single Page Application) and aside from the processed bundles, versioning etc. you would like it to have other runtime data that concerns your entire site, for instance some sort of a configuration (not secret, god forbids) that needs to be available for scripts on the client.

  • GitHub repo react-app-rewired

    Override create-react-app webpack configs without ejecting

    Project mention: Fullstack GraphQL starter kit Mid-2021 update | dev.to | 2021-06-03

    Switch to craco from react-app-rewired for better CRA v4 support (breaking change!)

  • GitHub repo svgr

    Transform SVGs into React components 🦁

    Project mention: svpug: Generate Pug mixins from SVG files | dev.to | 2021-05-11

    svpug is inspired by svgr which is the standard way of creating React components from SVGs.

  • GitHub repo webpack-dev-server

    Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/configuration/dev-server/.

    Project mention: Question about having different html file in development and production stage. | reddit.com/r/webpack | 2021-03-24

    Webpack Dev Server provides a live reload feature without having you to build & wait.

  • GitHub repo prerender-spa-plugin

    Prerenders static HTML in a single-page application.

    Project mention: SEO practice in SPA site | dev.to | 2021-03-13

    After investigation, the idea and the prerender-spa-plugin pre-rendering solution hit it off. The principle of the pre-rendering scheme can be seen in the following figure:

  • GitHub repo loadable-components

    The recommended Code Splitting library for React ✂️✨

    Project mention: Code Splitting in React using React.lazy and Loadable Components | dev.to | 2021-04-19

    In order to load the CatImage component to a separate bundle, we can make use of loadable components. Let's add @loadable-component to our package:

  • GitHub repo whitestorm.js

    :rocket: 🌪 Super-fast 3D framework for Web Applications 🥇 & Games 🎮. Based on Three.js

  • GitHub repo nwb

    A toolkit for React, Preact, Inferno & vanilla JS apps, React libraries and other npm modules for the web, with no configuration (until you need it)

  • GitHub repo Manta

    🎉 Flexible invoicing desktop app with beautiful & customizable templates.

    Project mention: How do you create your invoices? | dev.to | 2021-05-07

    My favorite is a free, open-source project Manta - a desktop application for creating invoices with beautiful and customizable templates.

  • GitHub repo Laravel Mix

    The power of webpack, distilled for the rest of us.

    Project mention: How to Use CMake Without the Agonizing Pain - Part 2 | reddit.com/r/cpp | 2021-05-31

    Oh, have I got the thing for you. You can just use laravel-mix for the common usecases:

  • GitHub repo vue-loader

    📦 Webpack loader for Vue.js components

    Project mention: [WP5/Vue] Can I write a rule that matches an issuer's resourceQuery? | reddit.com/r/webpack | 2021-03-17

    I am not proud of this solution, but it should only be necessary until a PR is accepted with these changes:

  • GitHub repo offline-plugin

    Offline plugin (ServiceWorker, AppCache) for webpack (https://webpack.js.org/)

    Project mention: 12 open source browser tools and how I've built them | dev.to | 2020-12-08

    Since Omatsuri is a browser only application the only thing that we need from service worker is to cache assets and provide app shell. Offline plugin does exactly that, the only thing we need to do – add it to the production build in webpack config:

  • GitHub repo css-loader

    CSS Loader

    Project mention: Why I left CSS-in-JS and returned to good old CSS preprocessors | dev.to | 2021-05-28

    One possible non-JSS solution is css-modules supported in css-loader. That requires some setup which may get convoluted if you need CSS preprocessors or SSR.

  • GitHub repo after.js

    Next.js-like framework for server-rendered React apps built with React Router

    Project mention: Why use Next.js + Strapi? | dev.to | 2021-05-06

    Within the React ecosystem there are other ways to achieve the same goal, either with After.js, Razzle or React-SSR.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2021-06-22.

Index

What are some of the best open-source Webpack projects in JavaScript? This list will help you:

Project Stars
1 webpack 58,492
2 JHipster 18,559
3 electron-react-boilerplate 17,804
4 react-loadable 16,009
5 electron-vue 14,123
6 webpack-dashboard 13,791
7 front-end-guide 13,711
8 webpack-bundle-analyzer 11,049
9 razzle 10,258
10 html-webpack-plugin 9,651
11 react-app-rewired 8,216
12 svgr 7,695
13 webpack-dev-server 6,961
14 prerender-spa-plugin 6,757
15 loadable-components 5,636
16 whitestorm.js 5,609
17 nwb 5,355
18 Manta 5,125
19 Laravel Mix 4,722
20 vue-loader 4,655
21 offline-plugin 4,419
22 css-loader 3,996
23 after.js 3,991