Modular build system for web projects 📦

Goals

• This project follows my Wheel Reinventor's Principles: In short, it's made from scratch for learning and to tailor it to my specific use cases.
• Extensible: Must be usable across multiple projects, with the possibility of creating project-specific extensions.
• Vanilla: Written in JavaScript with JSDoc annotations for type checking, no transpilation step necessary.
• Minimalistic: Keep the build process simple, avoid too many layers between your browser and your code.

Warning

This project was created primarily for personal use. For this reason, it is not fully documented and I would not recommend using it. That said, I hope it can at least be inspirational for your own projects!

Features

• Configuration-driven pipelines (see example pipelines).
• Extensible module system (list of built-in modules).
• Build once or continuously watch for changes.
• Dev server for serving built files over HTTP and communicating build-events over WebSockets.
• Hot reloading of JavaScript modules and other assets (more details).
• Generate import maps for node_modules so they can be imported without any bundling step.

Installation

npm install --save @tobloef/build-tool

Usage

build-tool [build-config] [--watch] [--serve] [--open] [--verbose] [--quiet]

If a build config is not specified, the build tool will attempt to read build-config.js from the working directory. If this file doesn't exist, a build config must be specified as a CLI option. You can either specify a path to a build config JavaScript file or use one of the presets (e.g. build-tool presets/github-pages).

The available flags are:

• --watch Continuously watch for changes and automatically rebuild.
• --serve Start the dev server and serve the build.
• --open Open the dev server's URL in the default browser.
• --verbose Log a lot of extra information.
• --quiet Only log errors.

Limitations

• Known issue: If circular import is encountered during when hot module reloading is enabled, the page will not load.