@farmfe/js-plugin-qiankun

JavaScript plugin for exposing Farm applications as qiankun micro-apps.

Installation

npm install @farmfe/js-plugin-qiankun --save-dev

yarn add @farmfe/js-plugin-qiankun --dev

pnpm add @farmfe/js-plugin-qiankun --save-dev

Usage

Register the HTML transform plugin:

import { defineConfig } from "@farmfe/core";
import { qiankunFarmPlugin } from "@farmfe/js-plugin-qiankun";

export default defineConfig({
  plugins: [
    qiankunFarmPlugin({
      appName: "myMicroApp",
      devMode: true,
    }),
  ],
});

Then register lifecycle hooks in your app entry:

import { injectQiankun } from "@farmfe/js-plugin-qiankun/helper";

injectQiankun({
  async bootstrap() {},
  async mount(props) {
    console.log(props);
  },
  async unmount() {},
});

Options

Plugin options

• appName: string — required qiankun app name. It must be a valid JavaScript identifier; the plugin throws otherwise.
• devMode?: boolean — append debug logging to the injected helper script. Defaults to false.

injectQiankun options

• bootstrap: () => Promise<void>
• mount: (props: unknown) => Promise<void>
• unmount: () => Promise<void>
• update?: (props: unknown) => Promise<void>

The Farm plugin appends a script to the HTML body that bridges these helper hooks to window[appName].