ZUI 扩展项目 UMD 库封装
SkillDev toolsWraps browser-ready UMD/IIFE libraries into loadable packages inside a ZUI extension project.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the ZUI 扩展项目 UMD 库封装 skill
About this capability
将已经可用的 UMD/IIFE 资源封装为独立 ZUI 扩展包,通过 LibLoader 按需加载。不转换资源格式,实施须批准集成计划。
What this skill tells your AI
The instructions your AI receives, as published by easysoft/zui in skills-exts/zuix-wrap-lib/SKILL.md and read by ahel’s review.
目标与硬边界
把第三方 UMD/IIFE 做成薄而完整的 ZUI 扩展适配层:第三方实现保持外置,由 LibLoader<T> 首次使用时加载;目标扩展包负责类型、公开 API、生命周期、样式接线、调试和文档。
- 只接受已经能由浏览器普通
<script>直接加载并暴露稳定全局变量的 UMD/IIFE 产物。 - 不把 ESM 转成 UMD,不调用转换技能,不用 bundler 重建、改写或内联第三方实现,也不把 ESM module loader 作为本技能兜底。
- 产物形态、来源或全局名不满足前提时停止,请求用户提供 ready-to-use UMD/IIFE 或缩小任务;不自行扩大范围。
- 不默认生成全部消费形态,只实现真实需求支持的 helper、vanilla、Preact、声明式创建或公开加载 API。
- 不自动提交、推送或发布。
准备与发现
- 在采取其他任务动作前,完整读取
../zuix-standards/SKILL.md,再完整读取:../zuix-standards/references/workflow.md../zuix-standards/references/library.md../zuix-standards/references/extension-library.md../zuix-standards/references/external-library.md- UI 组件再读 component 规范;无状态函数或服务 facade 再读 helper 规范;纳入调试或正式文档时再读相应规范。
- 完整读取 references/wrapper-shapes.md。按范围完整读取
../zuix-lib/SKILL.md、../zuix-component/SKILL.md、../zuix-helper/SKILL.md、../zuix-dev/SKILL.md、../zuix-doc/SKILL.md或../zuix-i18n/SKILL.md;由本技能统一确认门禁。 - 运行 resolver:
node ../zuix-standards/scripts/resolve-zui-ext-context.mjs --cwd <目标路径> --lib <目录名或包名> [--host <宿主根>] --json
- 记录
targetLibRoot(新库时先用 resolver 的plannedTargetLibRoot)、extensionRoot、gitRoot、zuiRoot + extsName,以及folderName、packageName、zuiName、publicPath。新库还不存在时先解析其计划父项目,以兄弟包和项目配置推导命名;package 元数据保持未解析,不能从扩展组名或目录名硬编码 package scope。 - 完整读取各层适用
AGENTS.md,检查gitRoot状态并保留已有修改。所有源码通过targetLibRoot/extensionRoot真实路径编辑,不通过宿主exts/符号链接写入。 - 检查 UMD 产物和许可证,只提取资源位置、版本、全局名、构造器/函数、初始化参数、返回值、事件、更新/销毁 API、配套 CSS/资源。用文件内容和实际加载行为确认不是伪装成
.js的 ESM。 - 从
zuiRoot读取当前LibLoader/getLib实现和外部库规范。在extensionRoot选择两个包角色、架构或消费方式相近的成熟包;不足时再选宿主实现。完整检查入口、类型、样式、调试页和文档。
只有缺口会改变目标库、公开 API、生命周期、UMD 来源/全局名或文件范围时才提问。zuiRoot/extsName 未解析不妨碍扩展侧设计,但不得猜测宿主路径、资源 URL 或联合命令。
设计封装
分别判断包角色和实现架构:
- 无状态函数/模块:异步 typed facade,通常不创建
Component。 - 增强已有 DOM 的有状态实例:原生
Component持有第三方实例,负责更新和销毁。 - 需要 ZUI 根据 props 生成结构且真实需要 Preact/vanilla:按组件规范选择 Preact 与
ComponentFromReact,不为理论入口增加 TSX。 - 全局服务或单例:按 helper 规范定义所有权、重入、错误和清理,不伪装成 UI 组件。
同时定义:
- 唯一 loader 注册名、生产资源路径、
check全局名、前置 JS/CSS 和宿主 dev 覆盖路径; - loader 私有性和是否确需公开加载 API;
- loading、失败传播/降级、缓存错误、显式重试;
- 类型来源与发布后解析,禁止第三方运行时 import 混入 bundle;
- 异步初始化期间 destroy、重复初始化、多实例、更新与第三方清理;
packageName、入口、依赖策略、zui.type/contributes、zuiName、publicPath、public 资源、样式、调试与文档边界。
一次集成计划
修改任何文件前,输出可直接实施的计划并请求用户明确确认,然后停止。计划至少包含:
- 四层上下文、新建/已有库、真实命名字段、包角色、架构、两个参考实现;
- UMD 来源、版本、许可证、目标
public/路径、全局名、loader 注册和资源依赖; - 扩展项目现行 package scope、初始版本、依赖协议、入口和
zui元数据; - 类型策略、公开 API、消费方式、数据流、error/retry、update/destroy;
extensionRoot内精确文件集,以及 README/dev、正式文档、样式、i18n 的纳入/排除;- 扩展侧检查与
zuiRoot + extsName宿主联合验收、剩余假设; - 明确标记的“已批准范围”。
本技能只设置这一次确认。完全落入批准范围的 component/helper/dev/doc 子流程不重复确认;目标、公开 API、包角色、UMD 资源、宿主影响或文件边界变化时重新规划。
实施
- 确认后重新运行 resolver 并检查
gitRoot状态,仅修改批准范围。新库最小 package 建立后再次运行 resolver,把plannedTargetLibRoot升级为真实targetLibRoot并核对所有命名字段;上下文或注册变化时先停止核对。 - 新包的 scope、版本、description、入口、exports、依赖协议和
zui元数据从extensionRoot当前配置及成熟兄弟包推导;不用@zui/*、workspace:*、link:或固定版本模板代替事实。publicPath只在宿主实际要求或非默认路径时声明。 - 将用户提供的 UMD/CSS/license 原样放入批准的
targetLibRoot/public/,或使用已批准且版本固定的绝对 URL;不编辑、压缩、转译或生成第三方产物。 - 在目标包私有 helper 中创建唯一
LibLoader<T>,显式配置src和check。多个 facade 共享 loader,不在组件类维护第二份模块缓存。 - 优先使用与 UMD 全局形状一致的第三方类型声明;只使用
import type。没有可靠声明时手写 facade 实际需要的窄接口;公共类型引用第三方包时确保消费者可解析。 - 每次异步加载后检查模块结果和实例存活状态;定义加载前方法、失败和显式重试行为;
destroy()清理第三方实例、监听、DOM 及其他副作用。 - 只创建真实需要的入口、component/vanilla/helper/types/style 和注册副作用;沿用扩展项目合理局部目录风格,不公开私有 loader,不创建空目录。
- 按扩展版
zuix-dev完成调试源:生产入口先注册相对资源,再用相同注册名和check覆盖宿主实际/exts/<extsName>/<folderName>/public/...地址;extsName未解析时不得写猜测值。HMR 重建前销毁旧实例。正式文档只在批准范围内实施。 - 依赖和 lockfile 在
extensionRoot按实际 pnpm 策略更新;不修改zuiRoot的依赖、锁文件、注册或缓存。
验证与交付
至少分别验证:
git -C <gitRoot> diff --check -- <extensionRoot 相对路径>;extensionRoot的目标 lint、类型、测试和依赖解析;- 在 resolver 唯一确认
zuiRoot + extsName后,使用准确zuiName的扩展联合构建; - 调试需要时从宿主启动扩展 dev,按宿主发现结果进入页面,不从
folderName猜路由; - 首次使用才加载、预载全局不重复加载、并发/多实例、失败与显式重试、加载返回前销毁、更新、重复初始化、最终清理;
- 构建后的 public 路径、license 和第三方类型解析。
交付时分开报告扩展侧与宿主侧结果、修改文件、公开 API、UMD/global、基线失败和未验证风险,并保留用户既有改动。
Signals
- GitHub stars
- 3k
- Forks
- 678
- Last commit
- Sep 2026
Advanced
- Catalog kind
- skill
- Gateway key
zuix-wrap-lib- Source
- github.com/easysoft/zui