Tuvix.js微前端框架

Lightweight、框架无关的微前端Orchestrator。使用 React、Vue、Svelte、Angular 或 Vanilla JS 构建可扩展、独立部署的前端应用。

在 GitHub 查看

🔧

框架无关

在同一个 Shell 中混合使用 React、Vue、Svelte、Angular 和 Vanilla JS 微应用，同时运行。

📦

零运行时依赖

每个包均无运行时依赖，支持 Tree-shaking，Lightweight。

🔀

内置路由

基于 URL 的微应用激活，路由切换时自动挂载/卸载。

📡

事件总线

微应用间类型安全的发布/订阅通信，无需共享全局变量。

🔒

CSS 与 JS 沙箱

Shadow DOM 样式隔离与 JS Proxy 作用域隔离，彻底防止样式泄漏。

⚡

动态加载

按需加载微应用包，支持缓存、重试逻辑和错误边界。

快速安装

bash

npm install tuvix.js

14 个包 · 10 种语言 · MIT 许可证

核心包

The orchestrator — registers, mounts, and manages all micro app lifecycles.

@tuvix.js/router

URL-based micro app routing with history and hash mode support.

@tuvix.js/event-bus

Typed inter-app communication. Publish and subscribe across micro apps.

@tuvix.js/loader

Dynamic module loading with caching, retry and error boundary support.

@tuvix.js/sandbox

CSS and JS isolation using Shadow DOM and JS Proxy. Prevent style leakage.

框架绑定

@tuvix.js/react

React 18+ bindings with hooks — useMicroApp, useTuvixEvent.

Vue 3 bindings with composables — useMicroApp, useTuvixEvent.

@tuvix.js/svelte

Svelte 3/4/5 bindings with reactive stores and lifecycle integration.

@tuvix.js/angular

Angular 15+ module, service and directive bindings for micro apps.

工具

@tuvix.js/devtools

In-browser debug panel. Inspect registered apps, events and loader state.

@tuvix.js/server

Server-side composition — pre-render and stitch micro app HTML on the server.

@tuvix.js/module-federation

Module Federation

Webpack 5 Module Federation integration for sharing remote micro apps.

create-tuvix-app

create-tuvix-app

CLI scaffolding tool. Instantly bootstrap a Tuvix.js micro app project.