Web Artifacts Builder
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
将已编写的宜搭自定义页面源码发布或更新到指定页面。提供源码路径、应用 ID 和自定义页面 ID 后,执行编译、发布和内容回读;原生表单不使用本技能。
$ npx skills add openyida/openyida --skill yida-publish-page -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install openyida/openyida yida-publish-page --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .claude/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .claude/skills/yida-publish-page && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .claude/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-pageType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add openyida/openyida --skill yida-publish-page -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install openyida/openyida yida-publish-page --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .agents/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .agents/skills/yida-publish-page && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .agents/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add openyida/openyida --skill yida-publish-page -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install openyida/openyida yida-publish-page --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .cursor/skills/yida-publish-page && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .cursor/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/openyida/openyida.git --path yida-skills/skills/yida-publish-page--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add openyida/openyida --skill yida-publish-page -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install openyida/openyida yida-publish-page --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .gemini/skills/yida-publish-page && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .gemini/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install openyida/openyida yida-publish-pageInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add openyida/openyida --skill yida-publish-page -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .github/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .github/skills/yida-publish-page && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .github/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add openyida/openyida --skill yida-publish-page -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install openyida/openyida yida-publish-page --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openyida/openyida.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/yida-skills/skills/yida-publish-page .opencode/skills/yida-publish-page && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "yida-publish-page" agent skill from https://github.com/openyida/openyida/tree/main/yida-skills/skills/yida-publish-page into .opencode/skills/yida-publish-page/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "yida-publish-page", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
yida-publish-page将已编写的宜搭自定义页面源码发布或更新到指定页面。提供源码路径、应用 ID 和自定义页面 ID 后,执行编译、发布和内容回读;原生表单不使用本技能。
Yida Publish Page is an agent skill from openyida/openyida. 将已编写的宜搭自定义页面源码发布或更新到指定页面。提供源码路径、应用 ID 和自定义页面 ID 后,执行编译、发布和内容回读;原生表单不使用本技能。
Its SKILL.md is about 3.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Frontend & Design, covering React components. The repository describes itself as: Your own personal YiDA AI assistant! The licence is MIT.
7 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit 4932d0b. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
nodeFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Yida Publish Page loads about 3.3k tokens when it runs. Until then it costs about 23 tokens; SKILL.md has 849 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from openyida/openyida at commit 4932d0b, republished under its MIT licence (© openyida). 849 words, ~3,349 tokens.
.claude/skills/yida-publish-page/SKILL.md (or your agent's skills folder).资源边界:本技能只处理普通 OpenYida 页面发布;目标不明时先只读确认或询问用户。
本技能负责三件事:确认发布目标、执行 openyida publish(包含必要编译和 Schema 写入)、给出 final 证据。新建或默认自定义页面源码先由 yida-canvas-custom-page 产出。缺少自定义页面容器时,先交给 yida-create-page 创建后再回来发布。
发布前必须先解析目标页面 context;本技能优先服务已有页面:
formUuid、bound page 或 workspace 中可确认的 display page 时,直接把该页面作为发布目标。formUuid 时发布到 B;B 只有名称或描述且无法唯一匹配时先问用户。yida-create-page。formType=display 的自定义页面;普通表单、流程表单、数据底表的 formUuid 不能作为 openyida publish 第三个参数。list-forms 确认。YidaCodeCanvas 组件实现的页面先看 yida-canvas-custom-page。project/pages/src/*.{canvas.jsx,canvas.tsx,oyd.jsx,jsx,tsx}.canvas.jsx / .canvas.tsx 不走 openyida check-page,统一执行 openyida compile <源文件> --json 让 CLI 按扩展名选择 Canvas 编译器;.oyd.jsx / .jsx / .tsx 不要当成 YidaCodeCanvas 页面发布,除非已明确确认源码就是 YidaCodeCanvas 组件源码并使用 --canvasrenderJsx / didMount 形态里手写 React Hooks;需要 Hooks 的页面应交回对应页面开发技能改成可编译的源码形态formUuid 当作发布目标;除非已确认目标是自定义展示页面,否则不要用 --force 绕过保护.canvas.jsx / .canvas.tsx 发布为 YidaCodeCanvas 组件;.oyd.jsx / .jsx / .tsx 发布为平台 Jsx 组件Jsx 组件 / oyb.jsx / renderJsx 维护源码发布前优先执行 openyida check-page <源文件路径> 和 openyida compile <源文件路径>;本技能只把它们作为发布前 guardYidaCodeCanvas 组件实现的页面发布前必须执行 openyida compile <源文件> --json;CLI 会自动选择 Canvas 编译器。失败时按本地校验修复处理结构化错误,不要改用 node -e、compileCanvasLocal 或 run_workspace_script 绕行openyida publish <源文件> <appType> <displayPageFormUuid> --canvas --health-check,由发布流程再次校验并写入 runtimeCode + importedModules/* @canvas-theme-provider */ 标记装配时才生成并发布 .themed.canvas.jsx。OPENYIDA_CANVAS_THEME_NOT_ASSEMBLED 表示误用了尚未装配的源文件,应先运行主题脚本再编译输出文件。OPENYIDA_CANVAS_ICON_EXPORT_UNAVAILABLE 时,按 details.exportName、源码行列与建议修正 import,并重新 compile;禁止换成动态全局引用绕过。校验以 CLI 内置的宜搭运行时导出清单为准;动态名称仍需组件映射与兜底。--health-check 的发布回读不等于浏览器渲染验收,不能据此把 runtimeSmokeVerified: false 报为已通过。OPENYIDA_CANVAS_NAVIGATION_INVALID 时,按 issueType 修正:local_platform 使用 local 页内模式或绑定真实平台资源;document_flex 重新提取 canvas-nav-content 并采用自然高度。发布后需实际检查各菜单、刷新/返回、滚动到页脚并回顶、窄屏展开;不能仅凭编译或回读认定通过。OPENYIDA_CANVAS_THEME_PROVIDER_INVALID 时,按报错位置调整 Provider 和业务组件的层级,再执行原命令;发布后打开实际页面检查首屏和交互。YidaCodeCanvas 组件实现的页面发布时,发布流程会在外层页面 didMount 注入 window.__OPENYIDA_YIDA_API__ 和 window.__OPENYIDA_UTILS__;不要在 Canvas 源码内补写 this.utils.yida.* 或根级 this.utils.*project/pages/src/:使用 YidaCodeCanvas 组件实现的页面用 <页面名>.canvas.jsx / <页面名>.canvas.tsx;平台 Jsx 组件维护源码用 <页面名>.oyd.jsx / <页面名>.jsx / <页面名>.tsx<workspace>/project/pages/src/ 与 <workspace>/projects/<id>/artifacts/ 中同名源码是否内容不一致;出现警告时必须确认实际要发布哪一份openyida env 检测通过,登录态有效openyida compile <源文件> --json 预检,并核对标准 form-open-container 片段已接入、openForm 已绑定、formOpenContainer 已挂载。不能通过添加同名空组件或忽略检查来绕过;发布后实际点击,验证 iframe、标题栏三个操作、拖拽调宽及关闭刷新。源码检查通过不代替交互验收。openyida publish 会自动读取目标页面现有 Schema 并合并页面级 dataSource;不要靠 Agent 口头承诺“保留数据源”,必须使用新版 CLI 的默认保护能力this.dataSourceMap.,而发布输出包含 No custom page data sources to preserve,本次发布不能视为完成;说明源码依赖设计器数据源但目标页没有可保留数据源。必须回到对应页面开发技能修复源码并重新发布,或先通过 yida-data-source-connectors 创建并绑定数据源后重新发布project/pages/src/*.{canvas.jsx,canvas.tsx,oyd.jsx,jsx,tsx},final 证据只认真实执行成功的 openyida publish <source> <appType> <displayPageFormUuid> 命令结果;本地文件编辑、diff、check-page、compile、compileCanvasLocal 或口头声明都不能证明远端页面已更新编写完自定义页面源码后,执行此技能将源码发布到宜搭平台。已有页面 URL / formUuid / bound page 时,默认发布到该已有页面。
正向触发:
⚠️ 代码必须先完成对应页面技能规范的编写,再执行发布。原生表单页面无需此命令,创建即生效。
entryMode 时按用途补齐独立入口,不要求用户提供新参数。发布前查询 get-form-config,未隐藏时执行 update-form-config <appType> <formUuid> false "<页面标题>" 并回读。用户明确保留导航或仅修改后台内容页时保留原配置;不要全局隐藏应用导航。publish 默认读取页面导航配置。确认 renderNav=false 后,url 和 standaloneUrl 返回干净的 /custom/<formUuid>,另保留 workbenchUrl;无须新 CLI 开关,不追加 isRenderNav=false 等导航 URL 参数。standaloneUrl=null 时检查 navigationVerification / navigationWarning,修复配置后用 get-form-config --json 取得最新地址,不为补链接重复发布源码。确认页面类型为 display 才返回自定义页地址。compile 和 publish 默认保留固定品牌色覆盖,在结果 warnings 中返回源码位置、字段、色值与影响;即使使用 --json 也保留告警。告警不表示品牌色已跟随应用主题。OPENYIDA_CANVAS_STRICT_THEME=1 启用严格检查,OPENYIDA_CANVAS_ALLOW_FIXED_BRAND=1 明确保留固定色覆盖。publish --fix-theme 显式迁移固定品牌色覆盖,可与 --strict-theme 合用,不能与 --allow-fixed-brand 合用。待迁移控件须位于已装配、已挂载的 CanvasThemeProvider 内;旁侧无关 Provider 不算主题来源。无法静态确认的动态渲染路径保留原文件,按主题开发技能手动接入;CLI 在内存中完成迁移和全部 Canvas 编译检查,通过后才写回。没有主题来源时先按主题开发技能接入,不能靠删除颜色回退到默认主题。--fix-theme 不改写品牌色。编译错误时保留原源码。openyida publish <源文件路径> <appType> <formUuid> [--health-check] [--force] [--canvas] [--compat] [--skip-lint] [--fix-theme] [--strict-theme] [--allow-fixed-brand] [--auto-nav-order] [--open|--no-open] [--json]路径口径:从仓库根执行时,源文件用 project/pages/src/...;如果 Bash cwd 已经是 <workspace>/project,源文件用 pages/src/...,不要传 project/pages/src/... 导致查找 project/project/pages/src/...。发布失败提示源文件不存在时,先按该规则切换路径,不要自动发布另一份文件。
openyida publish会按源码扩展名选择发布模式:.canvas.jsx/.canvas.tsx写入YidaCodeCanvas,并注入 yida/utils window 桥;.oyd.jsx/.jsx/.tsx写入平台Jsx组件。 发布前确认源码已由对应页面开发技能完成并通过相应本地检查;本技能只把真实成功的openyida publish作为远端完成证据。
| 参数 | 必填 | 说明 |
|---|---|---|
源文件路径 | 是 | 页面源码路径;.canvas.jsx / .canvas.tsx 写入 YidaCodeCanvas 组件,.oyd.jsx / .jsx / .tsx 写入平台 Jsx 组件 |
appType | 是 | 应用 ID |
formUuid | 是 | 自定义页面 ID,必须是 openyida list-forms <appType> 返回的 formType=display 目标,不要使用数据底表或流程表单 ID |
--compat / --modern | 否 | 兼容构建开关;仅在确认源文件属于平台 JSX 组件页面且扩展名不规范时使用;.oyd.jsx 默认自动启用 |
--canvas | 否 | 显式写入 YidaCodeCanvas Schema;.canvas.jsx / .canvas.tsx 扩展名已自动启用,仅当扩展名不规范但确认为 YidaCodeCanvas 组件源码时需要 |
--fix-theme | 否 | 仅 Canvas:需要将固定品牌色改为跟随应用主题时使用。确认控件位于主题 Provider 内、编译通过后才写回源码;可与 --strict-theme 合用,不能与 --allow-fixed-brand 合用 |
--strict-theme | 否 | 仅 Canvas:需要阻止固定品牌色覆盖时使用;发现覆盖即报错,不修改源码。不能与 --allow-fixed-brand 合用 |
--allow-fixed-brand | 否 | 仅 Canvas:明确保留固定品牌色覆盖,仍返回告警;不修改源码。不能与 --strict-theme 或 --fix-theme 合用 |
--health-check | 否 | 发布成功后用 token 读回目标页面 Schema,校验 YidaCodeCanvas.runtimeCode 或平台 Jsx + actions.module.compiled 与本次发布内容匹配;不请求页面 HTML,不依赖 Cookie |
--auto-nav-order | 否 | 仅在 PRD 缺少明确导航清单时使用;完整应用逐页发布不传此参数,全部页面开发并发布完成后由主流程单独执行 nav-group auto-order;PRD 已写明顺序时不要传本参数,发布后只执行一次 openyida nav-group order <appType> <页面/表单...>。排序失败不回滚页面,结果保留在结构化 navOrder 中 |
--force | 否 | 显式绕过发布目标类型保护;只有确认目标是自定义页面但导航接口暂时无法识别时才使用 |
--skip-lint | 否 | 历史平台 JSX 的 lint 开关;不跳过 Canvas 编译和抽屉检查,不能用来满足发布验收 |
--open / --no-open | 否 | 控制成功后是否返回浏览器打开提示,由宿主执行打开 |
--json | 否 | 机器可读输出;不改变校验和发布流程 |
发布前先确认目标页面,避免把 JSX 覆盖到数据底表:
openyida list-forms <appType> --keyword <页面名>只选择 formType=display 的 formUuid 作为发布目标。源码里用于 this.utils.yida 读写数据的普通表单常量(如 FORM_SKILL、FORM_DATA、FORM_TABLE)通常是数据底表,不能作为 openyida publish 的第三个参数。
openyida publish <source> <appType> <displayPageFormUuid> --canvas --health-check,且结果包含 publishMode=canvas、publishReadbackVerified=true、healthCheck.ok=true、healthCheck.readback.hasYidaCodeCanvas=true 和 runtimeCodeBytes>0。--health-check 是发布内容读回校验,不是浏览器运行态 smoke。输出中的 runtimeSmokeVerified=false、runtimeSmokeStatus=not_checked 表示本命令没有验证页面渲染与交互;需要宣称“页面可运行”时,必须另有专项运行态证据。<source> 必须是本轮实际 Write/Edit/Create 过的页面源码;<displayPageFormUuid> 必须是已解析的 display 自定义页面。发布了其他文件或其他目标页面,不满足本轮源码修改的 doneWhen。check-page / compile、Canvas 页面统一入口 openyida compile <源文件> --json 都是发布前 guard,不是远端完成证据。openyida publish 默认是非破坏式发布:保存新 JSX Schema 前会调用 getFormSchema 读取目标自定义页面已有 Schema,提取 Page 组件上的 dataSource,再与发布脚本内置的 urlParams、timestamp 数据源合并。用户在宜搭设计器里手工创建的 HTTP / VALUE / URI 等页面级数据源会随新源码一起保留。
如果读取旧 Schema 失败,发布会停止,避免在无法确认的情况下把已有数据源清空。遇到用户明确要求“保留原有数据源”时,不需要手写额外合并脚本,直接运行新版 openyida publish 即可。
发布后判定:
this.dataSourceMap.,发布输出 No custom page data sources to preserve 是正常情况,说明没有设计器数据源需要保留。this.dataSourceMap.,发布输出 No custom page data sources to preserve 不是完成态。不要把 API 发布成功等同于页面可用,必须补数据源或改源码后重新发布。openyida publish 会在保存 Schema 前执行确定性编译;Agent 不要把这一步改成口头检查:
.canvas.jsx / .canvas.tsx:发布前执行 openyida compile <源文件> --json;统一入口会按扩展名执行与发布阶段相同的 YidaCodeCanvas 编译并返回结构化结果。不要执行 openyida check-page,也不要直接调用内部编译函数或临时脚本。.oyd.jsx / .openyida.jsx 或显式 --compat:先运行 OpenYida compatibility compiler,输出宜搭平台 Jsx 组件可执行源码。.jsx / .tsx 源码如果已有 export function renderJsx():视为平台 Jsx 组件源码,执行 lint、Babel、UglifyJS 后构建 Schema。.jsx / .tsx 源码如果没有 renderJsx 但存在 export default function Page():只允许走有限 authoring 降级;Hooks、生命周期和运行态限制以yida-custom-page 为准。renderJsx 所需基础运行时导出,并修复事件绑定、数组回调等机械问题;这些是编译器职责,不要让 Agent 手写反复改。check-page 会硬拦截生命周期大小写错误、小写 onclick、渲染时直接执行事件函数、箭头函数只引用不调用方法、可见 <button> 没有事件等按钮不可点击问题。Jsx 组件源码会继续执行 Babel 转 ES5、UglifyJS 压缩,再构建 Schema 发布。这部分不是技能路由说明;它只是发布命令对不同源码扩展名的真实编译行为。
{"success":true,"formUuid":"FORM-XXX","version":0,"url":"{base_url}/APP_XXX/custom/FORM-XXX","standaloneUrl":"{base_url}/APP_XXX/custom/FORM-XXX","workbenchUrl":"{base_url}/APP_XXX/workbench/FORM-XXX","navigationVerification":{"renderNav":false,"verified":true},"navigationWarning":null,"publishMode":"canvas","publishReadbackVerified":true,"warnings":[],"runtimeSmokeVerified":false,"runtimeSmokeStatus":"not_checked","healthCheck":{"ok":true,"mode":"publish_readback","expectedPublishMode":"canvas","displayComponentPresent":true,"publishedContentMatched":true,"readback":{"hasYidaCodeCanvas":true,"runtimeCodeBytes":1024}}}发布时自动注入以下样式,覆盖宜搭平台默认 padding/margin:
body { background-color: #f2f3f5; }
.vc-page-yida-page { --yida-form-content-padding: 0; --yida-form-content-margin: 0; --yida-layout-padding: 0; }
.vc-deep-container-entry.vc-rootcontent { padding: 0 !important; margin-top: 0 !important; margin-right: 0 !important; margin-bottom: 0 !important; margin-left: 0 !important; }使用展开属性而非
margin: 0简写,因为宜搭平台的展开属性!important优先级更高。 如仍有残留样式,可在didMount中动态注入<style>标签覆盖。
base_url 决定| 异常场景 | 处理方式 |
|---|---|
| 源码构建或发布前校验失败 | 回到对应页面开发技能修复源码格式、语法或运行时兼容问题,再重新执行 openyida publish |
| 发布目标不是自定义展示页面 | 运行 openyida list-forms <appType> --keyword <页面名>,改用 formType=display 的页面 ID;不要对数据底表追加 --force |
| saveFormSchema 接口失败(401) | 检查登录态并恢复授权,核对原页面后按返回的恢复指引处理 |
| corpId 不匹配 | 核对目标组织,需切换时询问用户,不得强行发布或新建应用规避 |
| 发布后页面空白 | YidaCodeCanvas 页面检查 YidaComp 是否正确导出和依赖是否可加载;平台 JSX 组件页面检查 renderJsx 是否正确导出;同时查看浏览器控制台报错 |
| 发布接口成功但页面坏了 | 先用 get-schema 只读核对远端 Schema 与本轮发布回执,不为检查结果重复写入;首屏渲染、控制台报错和体验问题仍结合浏览器验证 |
| 发布后功能异常 | YidaCodeCanvas 页面优先查依赖白名单、YidaComp 导出、hooks 副作用清理;平台 JSX 组件页面检查 forceUpdate is not a function 等常见错误,参考 yida-custom-page 平台 JSX 组件页面规范 |
| 用户反馈发布反复失败、疑似安全(WAF)拦截 | 仅当发布返回 HTTP 200 但响应体非 JSON 且 body 含 waf_block 时判定为拦截;按 yida-canvas-custom-page 的 waf-safe-authoring.md 用二分法定位命中片段并替换写法后重发。非常规场景不启用 |
本地编译失败按本地校验修复处理,修复明确字段后再检查;不要因可修复的源码错误重新确认需求或创建新页面。参数缺失先从当前任务记录恢复,无法唯一确定目标时才询问。
权限或组织不匹配时停止写入并说明原因。发布请求超时、响应未知或保存后回读失败时,保留原页面并先只读核对,不能盲目重发发布或新建替代页。只有明确未写入、原因已修复且命令允许重试时才重试;源码诊断的重试规则不适用于远端写操作。
本技能在完整开发流程中的位置:
resolve existing page or create missing page → yida-canvas-custom-page → [本技能] yida-publish-page| 相关技能 | 关系说明 |
|---|---|
yida-create-page | 可选前置技能,仅在目标 display page 缺失且允许新增时创建页面容器,获取 formUuid |
yida-canvas-custom-page | 前置技能,编写 .canvas.jsx / .canvas.tsx 页面源码 |
yida-custom-page | 历史平台 JSX 组件页面维护技能;该技能自身闭环维护 .oyd.jsx / .jsx / 平台 Jsx 组件源码后,可调用本技能发布 |
yida-create-form-page | 无关,用于创建表单页面,不需要本技能发布 |
yida-page-config | 后续技能,发布后可配置页面公开访问/分享 |
yida-ppt-slider | 特殊场景,PPT 幻灯片页面也使用本技能发布 |
© openyida, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in yida-skills/skills/yida-publish-page of openyida/openyida.
Open the folder on GitHubat commit 4932d0b
Yida Publish Page next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Yida Publish Page this skillopenyida/openyida | 221 | — | ~3.3k | Automated safety check: Pass | MIT | |
| Web Artifacts Builderanthropics/skills | 180k | 40 repos | ~769 | Automated safety check: Pass | Apache-2.0 | |
| Tailwindcss Developmentanonaddy/anonaddy | 4.9k | 10 repos | ~865 | Automated safety check: Pass | MIT | |
| Core Component Library PatternsChrisWiles/claude-code-showcase | 6.1k | 8 repos | ~1.2k | Automated safety check: Pass | None | |
| React Router Developmentremix-run/react-router | 57k | 1 repos | ~1.5k | Automated safety check: Pass | MIT | |
| React UI State PatternsChrisWiles/claude-code-showcase | 6.1k | 8 repos | ~1.6k | Automated safety check: Pass | None |
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
anonaddy/anonaddy
Always invoke when the user's message includes 'tailwind' in any form.
ChrisWiles/claude-code-showcase
Reference for building UI with a token-based core component library: spacing, color and typography tokens, Box, stacks, Text, Button, Input and Card, plus layout patterns.
remix-run/react-router
Guides work on React Router apps by first identifying whether the app uses Framework, Data or Declarative mode, then loading the matching reference and the installed package docs.
ChrisWiles/claude-code-showcase
Sets patterns for React interfaces: when to show loading spinners or skeletons, how to surface errors, how to disable buttons during async work and how to handle empty lists.
vercel-labs/next-beats
Guides implementing animated page and state transitions in React with the native View Transition API, covering shared elements, list reorders and directional navigation.
openyida/openyida
宜搭自定义页面开发规范,使用 YidaCodeCanvas 组件实现现代 React18 自定义页面。用于官网、看板、工作台、列表、详情、门户壳、可视化、hooks 交互、表单入口,以及需要门户组件、数据管理视图、成员、部门或上传组件的场景;发布层自动注入 yida/utils window 桥。
openyida/openyida
快速发布 OpenYida npm 正式版或测试版。用户说“发布正式版”“发布测试版”“发 beta”或要求按当天日期生成版本 tag 时使用;不用于宜搭应用或自定义页面发布。
openyida/openyida
Plan 模式的视觉设计分支。基于需求选择视觉方向,再结合业务页面规划维护 build-plan.json 的 visualStyle,供 CLI 派生 design.md。
openyida/openyida
Prevent stale local OpenYida custom page source from overwriting live designer edits.
openyida/openyida
Generate, update, or drift-check agent-facing CodeMaps as progressive code terrain indexes for projects, features, capabilities, functions, modules, or bug chains.
openyida/openyida
面向 GPT-5.5 等强模型和熟练用户的轻量 AI Agent Harness / checkpoint-driven coding skill。默认用户已经把任务切到基本可执行的最小混沌单元;模型自行分解、探索与推进,人类通过最终目标、最小 spec、复述、checkpoint、证据验证与回写来低干扰控盘。
Categories
将已编写的宜搭自定义页面源码发布或更新到指定页面。提供源码路径、应用 ID 和自定义页面 ID 后,执行编译、发布和内容回读;原生表单不使用本技能。. Yida Publish Page is an agent skill from openyida/openyida.
Yida Publish Page fits situations like: tasks that involve React components.
Run `npx skills add openyida/openyida --skill yida-publish-page -a claude-code`. Or copy the skill folder (yida-skills/skills/yida-publish-page in openyida/openyida) into .claude/skills/yida-publish-page in your project. Claude Code loads it when a task matches its description.
Run `npx skills add openyida/openyida --skill yida-publish-page -a codex`. Or copy the skill folder (yida-skills/skills/yida-publish-page in openyida/openyida) into .agents/skills/yida-publish-page in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add openyida/openyida --skill yida-publish-page -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/yida-publish-page, .gemini/skills/yida-publish-page, .github/skills/yida-publish-page and .opencode/skills/yida-publish-page in your project.
Going by SKILL.md and its folder, Yida Publish Page needs the command-line tools its instructions call (node).
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Yida Publish Page is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 3.3k tokens (SKILL.md is roughly 13k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Yida Publish Page: Web Artifacts Builder (anthropics/skills, 180k stars), Tailwindcss Development (anonaddy/anonaddy, 4.9k stars), Core Component Library Patterns (ChrisWiles/claude-code-showcase, 6.1k stars) and React Router Development (remix-run/react-router, 57k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
openyida (a GitHub organization) maintains it in openyida/openyida, which has 221 GitHub stars. The repository holds 59 skills in this directory. The repository was last updated on October 10, 2026.
Source: openyida/openyida on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.