@gct-paas/core-components

PaaS 平台跨端基础组件包。提供与 Web/Mobile/Pad 无关的通用组件（图标、微前端容器等），被 core-web、render-web 依赖。

本文档面向后续开发与 AI 模型阅读：说明组件职责、wujie 全局代理及启动方式。

包信息

| 项 | 值 | | --- | --- | | 包名 | @gct-paas/core-components | | 入口 | es/index.mjs（类型：es/index.d.ts） | | 全局类型 | @gct-paas/core-components/types | | peer | @gct-paas/api、@gct-paas/core、@gct-paas/scss、vue>=3、vant>=4 |

import {
  AssetsSvgIcon,
  SvgIcon,
  WuJieContainer,
  coreComponentsCreateAppVue,
} from '@gct-paas/core-components';

在 monorepo 中的位置

core
 └── core-components（跨端组件）
       ├── core-web
       └── render-web

依赖说明

Peer Dependencies

| 依赖 | 用途 | | --- | --- | | @gct-paas/core | store、token、useNamespace、useUserStore 等 | | @gct-paas/scss | 组件 SCSS | | @gct-paas/api | 类型与请求 | | vant | 部分跨端组件 peer（Mobile 场景） |

Runtime Dependencies

| 依赖 | 用途 | | --- | --- | | wujie / wujie-vue3 | 微前端子应用容器 | | @icon-park/vue-next / @gct-paas/platform-icons | 图标资源 | | @vueuse/core、lodash-es、dayjs | 组件逻辑辅助 |

源码结构

packages/core-components/src/
├── assets-svg-icon/    # 远程/资产 SVG 图标组件
├── svg-icon/           # 本地 SVG 图标
├── icon-next/          # 统一图标入口（平台/资产/Park）
├── wujie-container/    # wujie 微前端容器
├── create-app-vue.ts   # 全局注册上述组件
└── index.ts

与 _gct 的关系

不挂载 _gct，但向 wujie 子窗口代理全局对象。

WuJieContainer 在 beforeLoad 中为子应用 window 注入只读 getter：

Object.defineProperty(win, '_gct', { get: () => window._gct });
Object.defineProperty(win, '_api', { get: () => window._api });

子应用 props 还会传入 appInfo、userInfo、token、themeColor 等（来自 _gct.store 与 platformStore）。

启动与用法

通常由 core-web 间接调用，无需单独 setup：

import { coreComponentsCreateAppVue } from '@gct-paas/core-components';

// 在 createApp 阶段注册全局组件（内部防重复注册）
coreComponentsCreateAppVue(app);

直接使用组件：

<WuJieContainer wuJieName="sub-app" props={{ /* 额外 props */ }} />
<AssetsSvgIcon name="xxx" />
<IconNext name="xxx" />

主要导出速查

| 导出 | 说明 | | --- | --- | | AssetsSvgIcon | 资产库 SVG 图标 | | SvgIcon | 本地 SVG | | WuJieContainer | wujie 子应用容器 | | icon-next | IconNext 及 hooks | | coreComponentsCreateAppVue | 一次性全局注册 |

给后续模型的约束

1. 跨端通用 UI放本包；Web 专属复杂表单/表格放 core-web。
2. wujie 子应用依赖主应用 _gct 时，必须用 WuJieContainer，不要手动 patch 子 window。
3. coreComponentsCreateAppVue 有 isRegistered 守卫，重复调用安全。
4. 样式使用 useNamespace + SCSS BEM，见仓库 BEM skill。

本地命令

cd packages/core-components
npm run dev
npm run build        # lint + vue-tsc + 双 Vite 构建