Ecosystem overview
The qiankun core runtime loads and manages instances through loadMicroApp. Official companion packages cover project creation, micro-app builds, and framework component integration.
Official packages
| Package | Purpose | Use it when |
|---|---|---|
qiankun | Core runtime and loadMicroApp API | The host needs direct control over instances |
@qiankunjs/bundler-plugin | Vite and Webpack integration | Preparing an existing project as a micro-app |
@qiankunjs/react | React <MicroApp> component | React component lifecycles should manage instances |
@qiankunjs/vue | Vue <MicroApp> component | Vue component lifecycles should manage instances |
Application code should not depend directly on undocumented internal workspace packages.
Choose an integration style
- Call
loadMicroAppdirectly: the default when the host needs full instance control. - Use React or Vue
<MicroApp>: declarative loading in a component tree, still backed byloadMicroApp. - Use
registerMicroApps + start: only for the route-driven alternative where the URL completely determines activation.
All three host styles use the same micro-app HTML Entry, lifecycle, and isolation model.
Create a new project
Project creation ships as an Agent skill — install the skill, then let a coding agent generate the projects following the official conventions:
npx skills add umijs/qiankunOnce installed, describe your goal to the agent; it can generate a host using loadMicroApp or the MicroApp component, and React or Vue micro-apps. Without an agent, follow the tutorial to build the setup by hand.
Prepare an existing micro-app
Use @qiankunjs/bundler-plugin to prepare the HTML Entry, then follow the guide for your build tool:
See the bundler plugin reference for exports, options, and compatibility.
Load from a framework component
The React and Vue bindings create the container, call loadMicroApp, pass props, and unmount the instance with the component:
Using a wrapper does not change the micro-app contract. The micro-app still renders into props.container and releases its own resources in unmount.