FuseBox Bundler

1.3.135 · abandoned · verified Wed Apr 22

FuseBox is a JavaScript bundler and module loader known for its fast bundling times and zero-configuration approach for common setups. It aims to combine features found in tools like webpack and SystemJS. Key differentiators include first-class TypeScript support, built-in Rollup integration, and a developer-friendly experience with a fast dev server and Hot Module Replacement (HMR). The latest major version of the core bundler, `fuse-box`, is v4.0.0, released in April 2020. However, development appears to have ceased, with no significant updates to the core library since then, and the `fusebox-cli` package itself has not been updated since February 2018. Users should be aware that the project is effectively abandoned, lacking active maintenance or a release cadence, making it a potentially risky choice for new or ongoing projects requiring support and modern compatibility.

Common errors

```
TypeError: FuseBox.init is not a function
```
cause The `fuse-box` package was not imported correctly, or the `fusebox-cli` package was installed instead of the core `fuse-box` library which contains the `FuseBox` class.

fix Ensure `fuse-box` is installed (`npm install fuse-box --save-dev`) and imported using `import { FuseBox } from 'fuse-box';` for ESM or `const { FuseBox } = require('fuse-box');` for CommonJS.
```
TS2307: Cannot find module 'fuse-box' or its corresponding type declarations.
```
cause The `fuse-box` package is not installed in your project's `node_modules`, or TypeScript cannot resolve its type definitions.

fix Install `fuse-box` as a development dependency: `npm install fuse-box --save-dev` or `yarn add fuse-box --dev`. If using TypeScript, ensure your `tsconfig.json` is correctly configured to include `node_modules/@types`.
```
SyntaxError: Cannot use import statement outside a module
```
cause You are attempting to use ECMAScript Modules (ESM) `import` syntax in a file or environment configured for CommonJS (CJS).

fix Either configure your project to use ESM (e.g., add `"type": "module"` to `package.json`, or use a `.mjs` file extension for your build script) or switch to CommonJS `require` syntax: `const { FuseBox } = require('fuse-box');`.

Warnings

breaking Version 4.0.0 of the `fuse-box` core library introduced significant changes and improvements, which are likely to include breaking changes from previous major versions (v3.x). Directly upgrading without consulting the documentation can lead to build failures.
Fix: Consult the official FuseBox v4 documentation (fuse-box.org/docs/getting-started/setup) for migration details and updated configuration options. Review your `fuse.js` or configuration file for compatibility.
breaking The `fuse-box` bundler project and its companion `fusebox-cli` appear to be abandoned. The core `fuse-box` library has not seen updates since April 2020 (v4.0.0), and `fusebox-cli` has not been updated since February 2018 (v1.3.135). Continued use may lead to compatibility issues with newer Node.js versions, security vulnerabilities, or lack of support for modern JavaScript/TypeScript features.
Fix: Consider migrating to an actively maintained bundler (e.g., Webpack, Rollup, Vite, esbuild) for new projects or existing projects requiring ongoing support, security updates, and compatibility with the latest ecosystem standards.
gotcha There is a distinction between the `fusebox-cli` package and the `fuse-box` core library. While `fusebox-cli` provides command-line utilities, the main bundler logic and its configuration are handled by the `fuse-box` package. It's crucial to install `fuse-box` as the core dependency, not just `fusebox-cli`, for bundler functionality.
Fix: Always ensure the `fuse-box` package is installed as a development dependency: `npm install fuse-box --save-dev` or `yarn add fuse-box --dev`. The quickstart often recommends `npm install typescript fuse-box --save-dev`.

Install

npm install fusebox-cli npm
yarn add fusebox-cli yarn
pnpm add fusebox-cli pnpm

Imports

FuseBox
wrong:
```
import FuseBox from 'fuse-box';
```
correct:
```
import { FuseBox } from 'fuse-box';
```
This is the primary class for configuring and running the bundler. Requires the `fuse-box` package, not `fusebox-cli`. Assume named import for TypeScript environments.
FuseBox
wrong:
```
const FuseBox = require('fuse-box');
```
correct:
```
const { FuseBox } = require('fuse-box');
```
For CommonJS environments. While FuseBox supports modern targets, many build scripts might still use CommonJS `require` syntax. Destructuring is typical for named exports.

Quickstart

This example demonstrates how to initialize FuseBox with basic configuration for a TypeScript project and bundle a single entry file into an output file.

import { FuseBox } from 'fuse-box';

// Basic configuration for bundling a TypeScript project
const fuse = FuseBox.init({
    homeDir: "src/",
    sourceMap: {
         bundleReference: "./sourcemaps.js.map",
         outFile: "sourcemaps.js.map"
    },
    outFile: "./out.js",
    cache: true,
    log: true
});

// Bundle the main entry point 'index.ts'
fuse.bundle(">index.ts");

// To run the development server with HMR (Hot Module Replacement)
// fuse.dev({
//     port: 4444,
//     hmr: true,
// });
// fuse.bundle(">index.ts");

view raw JSON →