a single-spa plugin for preact applications
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.babelrc
.gitignore
.npmignore
LICENSE
README.md
package.json

README.md

single-spa-preact

Generic lifecycle hooks for Preact applications that are registered as applications of single-spa.

Quickstart

First, in the single-spa application, run npm install --save single-spa-preact. Then, in the application's entry file, add the following.

import preact from 'preact';
import rootComponent from './path-to-root-component.js';
import singleSpaPreact from 'single-spa-preact';

const reactLifecycles = singleSpaPreact({
  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 single-spa-preact via the opts parameter when calling singleSpaPreact(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: (required) A function that takes in no arguments and returns a DOMElement. This dom element is where the Preact application will be bootstrapped, mounted, and unmounted.