explaingit

browserify/browserify-handbook

4,600JavaScriptAudience · developerComplexity · 3/5LicenseSetup · easy

TLDR

A handbook explaining how to use Browserify to write modular JavaScript using Node.js-style require() calls and bundle it for the browser.

Mindmap

mindmap
  root((Browserify Handbook))
    Core Concept
      require in browser
      npm for browser
      Bundle at build time
    Development
      Source maps
      Auto-recompile
      Live reload
    Transforms
      Syntax conversion
      Template compiling
      Plugin ecosystem
    Advanced Bundling
      External bundles
      Code splitting
      Bundle minimization
    Testing
      Node and browser
      Code coverage
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Bundle a Node.js-style JavaScript project into a single file that runs in any browser

USE CASE 2

Use npm packages in browser-side code without manual script tags or global variables

USE CASE 3

Set up a development workflow that automatically rebuilds and reloads the browser app on file save

USE CASE 4

Split a large application into multiple bundles so users only download what they need

Tech stack

JavaScriptNode.jsnpmBrowserify

Getting it running

Difficulty · easy Time to first run · 30min

This is a documentation repo with no code to install, just read it online or clone and open the markdown files.

Free to share and use under Creative Commons Attribution 3.0, meaning you can copy and distribute it as long as you credit the author.

In plain English

Browserify is a tool that lets JavaScript developers write code in the same style used for Node.js server applications and then package it so it runs in a web browser. The core problem it solves: browser JavaScript has historically lacked a standard way to split code into reusable files that import from each other. Browserify borrows the require() function from Node.js and makes it work in the browser by bundling all the pieces into a single file at build time. This handbook covers how to use Browserify from the ground up. It starts with the basics: you write files that each export functionality, require other files when you need them, and then run Browserify on your entry point to produce one combined file for the browser. The same package manager used for Node.js, called npm, becomes your way to install third-party libraries, and most npm packages can be used in the browser through Browserify with no changes. A large section covers development workflow tools. These include source maps (which let you debug the original files in your browser's developer tools even though only a bundled file is loaded), auto-recompile tools that rebuild the bundle whenever you save a file, and live-reload options that automatically refresh the browser during development. Several popular task runners have Browserify plugins listed. The guide then covers advanced topics: transforms (plugins that process files during the bundle step, such as converting newer JavaScript syntax or compiling templates), splitting a bundle into multiple files for better browser caching, building reusable components, and testing modules both in Node and in the browser. A section on minimizing bundle size rounds out the coverage. This repository is documentation, not a code library. No installation is needed to read it, and it is most useful to a JavaScript developer who already knows basic browser development and wants to adopt a more structured, module-based approach to organizing their code. The handbook is licensed under Creative Commons Attribution 3.0.

Copy-paste prompts

Prompt 1
I have a JavaScript project using Node.js modules with require(). Show me how to set up Browserify to bundle it for the browser, including a source map for debugging.
Prompt 2
Set up a Browserify dev workflow with watchify so the bundle rebuilds automatically when I save a file, and open a local server to serve the result.
Prompt 3
I want to write a reusable JavaScript component that works both in Node.js and in the browser via Browserify. Show me how to structure exports and test it in both environments.
Prompt 4
How do I split a large Browserify bundle into separate vendor and app files so the vendor bundle is cached by browsers between deploys?
Open on GitHub → Explain another repo

← browserify on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.