fsbx

library2.1.0-beta.4jsnpmunverified

FuseBox is a JavaScript module bundler and loader that gained traction for its speed and 'zero configuration' approach to common tasks, especially with TypeScript. It previously offered features like Hot Module Replacement (HMR), a development server, and built-in Rollup support. The project released its v4.0.0 version, which notably shifted its configuration paradigm from programmatic JavaScript/TypeScript files to an XML-based system using `fusebox.xml` and `circuit.xml` files. However, the `fuse-box` GitHub repository was archived by its owner on June 20, 2023, and is now read-only. This indicates that while FuseBox v4 exists, it is no longer actively maintained or developed, and the project is considered abandoned. During its active development, key differentiators included reported blazing fast bundle times (50-100ms rebuilds), first-class TypeScript support without extensive configuration, and a comprehensive loader API supporting 'arithmetic instructions' and wildcard imports.

web-framework devops

npm install fsbx

github ↗package ↗

INSTALL

IMPORT

SIG · FSBX

fsbx

web-frameworkjavascriptv2.1.0-beta.4

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

FuseBox

✓ const { FuseBox } = require('fuse-box');

✗ import { FuseBox } from 'fuse-box';

Configuration files are primarily CommonJS (Node.js) using `require` for instantiating the bundler, especially in v3. While ES module `import` might be used in application code, the bundler configuration itself typically uses `require`.

WebIndexPlugin

✓ const { WebIndexPlugin } = require('fuse-box');

✗ import WebIndexPlugin from 'fuse-box/plugins/WebIndexPlugin';

Plugins are exposed as named exports from the main `fuse-box` package. The `plugins` directory is not typically imported directly.

This quickstart demonstrates how to configure FuseBox for a basic TypeScript project, including setting up a development server with Hot Module Replacement (HMR) and a production build with minification and HTML generation. This configuration style is typical for FuseBox v3.x.

import { FuseBox, WebIndexPlugin, CSSPlugin, QuantumPlugin } from "fuse-box"; import * as path from "path"; async function bundleApp() { const isProduction = process.env.NODE_ENV === "production"; const fuse = FuseBox.init({ homeDir: "src", // Your source code directory output: "dist/$name.js", // Output bundled files to dist/ target: "browser", // Target browser environment hash: isProduction, // Add hash to filenames in production plugins: [ CSSPlugin(), // Process CSS files WebIndexPlugin({ template: "src/index.html" }), // Generate index.html isProduction && QuantumPlugin({ uglify: true, // Minify JavaScript css: true, // Minify CSS }), ].filter(Boolean), log: !isProduction, debug: !isProduction, }); // Setup development server with HMR for non-production builds if (!isProduction) { fuse.dev({ port: 4444, httpServer: true }); fuse.bundle("app") .instructions(`>index.ts`) // Entry point .hmr() // Enable Hot Module Reloading .watch(); // Watch for changes } else { // Production bundle fuse.bundle("app") .instructions(`>index.ts`); } await fuse.run(); console.log("FuseBox bundling complete!"); } bundleApp().catch(console.error); // To make this runnable, ensure you have: // 1. A 'src' directory with 'index.ts' (e.g., console.log("Hello from FuseBox!");) // 2. A 'src/index.html' (e.g., <body><div id="root"></div></body>) // 3. Run with `NODE_ENV=development ts-node fuse.ts` or `NODE_ENV=production ts-node fuse.ts`

Debug

Known issues

breakingThe FuseBox project's official GitHub repository (`fuse-box/fuse-box`) was archived on June 20, 2023, and is now read-only. This signifies that the project is no longer actively maintained or developed, and no further updates, bug fixes, or security patches will be released. Users should consider migrating to actively maintained alternatives.

fix

Migrate to an actively maintained bundler like Webpack, Rollup, Parcel, or Vite.

affects: >=3.7.1

breakingFuseBox v4.0.0 introduced a fundamental shift in configuration, moving from programmatic JavaScript/TypeScript files (like `fbx_switch.js`) to an XML-based system, requiring `fusebox.xml` and `circuit.xml` files. This is a significant breaking change; existing v3 configurations are incompatible with v4.

fix

Rewrite your FuseBox configuration using the new XML schema as described in the v4 documentation, or stick to FuseBox v3.x and consider migration due to project abandonment.

affects: >=4.0.0

gotchaOlder Node.js versions might not be compatible. The `package.json` specifies `"node": ">= 6.9.5"`, but due to project abandonment and lack of updates, newer Node.js versions might introduce unforeseen compatibility issues.

fix

Refer to the `engines` field in `package.json` for compatible Node.js versions. For abandoned software, it's safer to use the Node.js version contemporary with its last active development.

affects: <=3.x

gotchaSome internal polyfills have changed in minor versions (e.g., `stream-browserify` was added, `uws` was replaced with `ws`). If your application relied on specific behaviors or had conflicts with these polyfills, updates could introduce subtle bugs.

fix

Carefully review changelogs for minor versions before upgrading and test thoroughly, especially concerning network and stream-related functionalities.

affects: >=3.2.1

Errors

Common errors & fixes

Missing semicolon messed up with UMD init

A bug in FuseBox's UMD build output.

fix

Upgrade to FuseBox v3.2.2 or later, which includes a fix for this issue.

Domain polyfill syntax error

An incorrect syntax within the domain polyfill bundled by FuseBox.

fix

Upgrade to FuseBox v3.7.0 or later to get the fix for the domain polyfill syntax error.

ReferenceError: process is not defined (during Quantum build)

Older versions of FuseBox's Quantum plugin might not correctly handle global `process` or `process.env` variables during optimization, leading to runtime errors in client-side bundles.

fix

Upgrade to FuseBox v3.6.0 or later, which includes a fix for `process` and `process.env` handling in Quantum builds.

CSSResourcePlugin backslashes fixes on Windows 10 (or similar path issues)

Path handling inconsistencies, particularly with backslashes on Windows, affecting resource resolution in CSS.

fix

Upgrade to FuseBox v3.2.2 or later, which includes fixes for CSSResourcePlugin path issues on Windows. Ensure consistent path separators in your configuration.

Upgrade

Version history

2.1.0-beta.4latest on npm

Audit

Dependencies

typescriptoptionalCommonly installed as a development dependency for projects using FuseBox with TypeScript source code.

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/fuse-box/fuse-box ↗

packagehttps://www.npmjs.com/package/fsbx ↗