Registry / web-framework / asma-qiankun-plugin-vite

asma-qiankun-plugin-vite

JSON →
library0.2.9jsnpmunverified

A Vite plugin (v0.2.9) for integrating micro-apps with Qiankun, supporting ES modules and HMR in development. Maintains Vite's fast build while adding Qiankun lifecycle hooks and sandbox window. Releases are infrequent with minor patches. Unlike qiankun's own plugin, this one uses a separate helper import for lifecycle utilities and explicitly avoids JavaScript sandbox in favor of manual qiankunWindow usage. Requires Vite >=2 and TypeScript >=4. Current version is stable and feature-complete.

npm install asma-qiankun-plugin-vite
INSTALL
IMPORT
SIG · ASMA-QIANKUN-PLUGI
A
asma-qiankun-plugin-vite
web-frameworkjavascriptv0.2.9
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18223 runs
build_error
glibc
node 18223 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

qiankun
import { qiankun } from 'asma-qiankun-plugin-vite';
import qiankun from 'asma-qiankun-plugin-vite';
qiankun is a named export, not default.
generateQiankunHelpers
import { generateQiankunHelpers } from 'asma-qiankun-plugin-vite/helper';
import { generateQiankunHelpers } from 'asma-qiankun-plugin-vite';
Helpers are exported from the submodule 'helper', not main entry.
qiankunWindow
import { generateQiankunHelpers } from 'asma-qiankun-plugin-vite/helper'; const { qiankunWindow } = generateQiankunHelpers('appName');
import { qiankunWindow } from 'asma-qiankun-plugin-vite/helper';
qiankunWindow is not a direct export; you must call generateQiankunHelpers to obtain it.

Configures Vite with the qiankun plugin, then sets up Qiankun lifecycle hooks and conditional rendering based on sandbox flag.

// vite.config.ts import { qiankun } from 'asma-qiankun-plugin-vite'; export default { plugins: [qiankun('myMicroAppName')], base: 'http://xxx.com/' } // main.ts import { generateQiankunHelpers } from 'asma-qiankun-plugin-vite/helper'; const { renderWithQiankun, qiankunWindow } = generateQiankunHelpers('myMicroAppName'); renderWithQiankun({ mount(props) { console.log('mount'); const { container } = props; const root = container?.querySelector('#root') || document.querySelector('#root'); ReactDOM.render(<App />, root); }, bootstrap() { console.log('bootstrap'); }, unmount(props: any) { const { container } = props; const root = container?.querySelector('#root') || document.querySelector('#root'); ReactDOM.unmountComponentAtNode(root); }, }); if (!qiankunWindow.__POWERED_BY_QIANKUN__) { ReactDOM.render(<App />, document.querySelector('#root')); }
Debug
Known issues
gotchaES module loading conflicts with Qiankun's JavaScript sandbox. Micro-apps do NOT run inside sandbox; window assignments may leak.
fix
Always use qiankunWindow from generateQiankunHelpers instead of window for shared state.
affects: >=0.0.0
gotchauseDevMode conflicts with hot-reload plugins like @vitejs/plugin-react-refresh. Disable hot-reload when useDevMode=true.
fix
Conditionally exclude hot-reload plugin when useDevMode is enabled: e.g., ...(useDevMode ? [] : [reactRefresh()])
affects: >=0.0.0
breakingqiankunWindow and renderWithQiankun are only accessible via generateQiankunHelpers('appName'), not direct imports from the package.
fix
Replace direct imports with destructured calls to generateQiankunHelpers.
affects: >=0.0.0
gotchaThe 'appName' argument to qiankun() and generateQiankunHelpers() must match the host's registered app name exactly.
fix
Ensure both calls use the same string, typically defined in the host's registerMicroApps.
affects: >=0.0.0
Errors
Common errors & fixes
Cannot find module 'asma-qiankun-plugin-vite/helper'
Import path does not include '/helper' or module resolution is misconfigured.
fix
Use import { generateQiankunHelpers } from 'asma-qiankun-plugin-vite/helper' (note the subpath).
TypeError: qiankun is not a function
Default import used instead of named import.
fix
Use import { qiankun } from 'asma-qiankun-plugin-vite' (curly braces).
Uncaught TypeError: Cannot set properties of undefined (setting 'customxxx')
qiankunWindow is undefined because generateQiankunHelpers was not called or incorrect import path.
fix
Ensure correct import and invocation: const { qiankunWindow } = generateQiankunHelpers('myMicroAppName'); then use qiankunWindow.customxxx = 'ssss'.
Upgrade
Version history
0.2.9latest on npm
Audit
Dependencies
viterequiredPeer dependency: plugin hooks into Vite's build and dev server.
typescriptoptionalPeer dependency: plugin ships TypeScript types and requires TS >=4 for compilation.
Agent activity
28 hits · last 30 days
node
24
OpenAI (training)
1
Resources
asma-qiankun-plugin-vite — npm install asma-qiankun-plugin-vite · libregistry