Skip to main content
Version: 1.x

one-spa-preact

one-spa-preact is a helper library that helps implement one-spa registered application lifecycle functions (bootstrap, mount and unmount) for for use with Preact. Check out the one-spa-preact github.

Installation​

npm install --save preact

Quickstart​

In your project's entry file, add the following:

import preact from "preact";
import rootComponent from "./path-to-root-component.js";
import oneSpaPreact from "one-spa-preact";

const preactLifecycles = oneSpaPreact({
  preact,
  rootComponent,
  domElementGetter: () => document.getElementById("main-content"),
});

export const bootstrap = preactLifecycles.bootstrap;
export const mount = preactLifecycles.mount;
export const unmount = preactLifecycles.unmount;

Options​

All options are passed to one-spa-preact via the opts parameter when calling oneSpaPreact(opts). The following options are available:

  • preact: (required) The main Preact object, which is generally either exposed onto the window or is available via require('preact') or import preact from 'preact'.
  • rootComponent: (required) The top level preact component which will be rendered
  • domElementGetter: (optional) A function that is given the one-spa props and returns a DOMElement. This dom element is where the Preact application will be bootstrapped, mounted, and unmounted. If omitted, a div will be created and appended to the body.