Getting Started§
Set up hyperfrontend and create your first micro-frontend feature in minutes.
Prerequisites§
Before you begin, ensure you have:
- Node.js 18+ and npm/yarn/pnpm
- An existing web application you want to convert into a feature (or a fresh project)
Installation§
Install the package:
npm install @hyperfrontend/featuresIt bundles @hyperfrontend/nexus and its other direct dependencies, so your app takes on no transitive install burden.
Creating a Feature§
Initialize an existing application as a hyperfrontend feature:
npx @hyperfrontend/features initWhat happens: The CLI scaffolds the hostee glue module into your app and wires it into the entry file, alongside a feature.config.* file and a contract that defines the messages your feature can send and receive.
Building a Shell§
Generate a self-contained shell package that any host can install:
npx @hyperfrontend/features buildThe CLI generates the host connector, inlines the contract, bundles direct dependencies, and packs a publishable tarball with typed bindings. The host installs one package and takes on no transitive deps.
Testing Your Feature§
Serve your apps with the debug UI to see how your feature loads:
npx @hyperfrontend/features devThis starts one static server per app plus an in-browser debug UI for inspecting host/hostee message traffic, display modes, and the security envelope.