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.