无界-Wujie

微前端痛点与“无界”的诞生

• 痛点回首：传统微前端框架（如 qiankun）依赖 JS 劫持与运行时样式沙箱，带来了 Vite 适配困难（UMD 限制）、CSS 隔离不彻底、多页签无法无损保活等顽疾
• wujie-vue 的魔力：将复杂的微前端架构，封装成了一个简单的 Vue 组件 <WujieVue/>。引入它，就像引入一个普通的 Element-UI 组件一样自然。

无界之所以能做到“零改造成本”与“极速加载”，秘密在于它对浏览器原生特性的精妙组合：

• JS 沙箱（物理隔离）：子应用运行在无 DOM 渲染的空 <iframe> 中。全局变量互不干扰，天然支持原生 ESM（Vite 项目无需任何降级打包）。
• CSS 与 DOM 沙箱（WebComponent）：子应用的 HTML/CSS 被渲染在 Shadow DOM 内。样式绝对隔离，主、子应用样式互不影响，且能完美同屏共存。
• 连接桥梁：无界底层重定向了 iframe 内部 JS 对 DOM 的操作，让子应用误以为自己运行在一个正常的浏览器页面中。

接入及使用

安装依赖

npm install wujie-vue3

页面使用

<template>
  <div class="container">
    <WujieVue
      name="my-sub-app"
      url="http://localhost:8080/"  //根据env环境动态调整url
      :sync="true"
      :alive="true"
      :props="{ theme: 'dark' }"
    />
  </div>
</template>

## js部分
import WujieVue from "wujie-vue3";

待补充.....