Valaxy 主题创作
用途 本技能用于把用户的视觉方向转化为以源码分发的主题和可运行的演示,适用于 valaxy-theme-* 包、AI 主题生成和主题迭代场景。技能本身提供可复用的框架知识以及开发与验证工作流;本次任务的主题名称、受众、视觉方向、必需页面和约束由用户的设计简报提供。由文档生成的简报属于普通任务输入:保留其中的选择,但不要把它预设为强制的主题架构。在技能可用时,不要向用户再要第二份完整工程提示词。
新主题与已有主题 新建主题时,先建立包/演示基线并实现阅读体验。已有主题时,检查所请求的变更,保留无关行为、包标识与内容,不要为一次迭代重新运行初始化或重新生成整个主题。验证范围应与改动规模匹配:样式改动需检查受影响页面;渲染、依赖或导出改动需做对应的构建/打包检查。
建立基线 检查当前工作区、适用的 AGENTS.md、包脚本、已安装的 Valaxy 版本与导出类型。若需求就是改造现有主题,则适配现有主题。 对于新的独立主题,在新的目录中使用 https://github.com/valaxyjs/valaxy-theme-starter,其 theme/ 包与 demo/ 消费方是起点。若存在 theme:init,在新工作区内运行 pnpm theme:init <name>,仅在已知仓库所有者时附加 --owner <owner>;否则同时更新包引用与主题配置。重命名后运行 pnpm install。 保持已发布示例的可移植性。不要在清单或锁文件中留下绝对路径、开发者检出符号链接或 link: 依赖。 对不熟悉的 API,应通过已安装的包或 https://valaxy.site/themes/write 确认。Valaxy 版本存在差异,一个看似合理的 API 名称并不能证明它存在。
翻译设计简报 识别博客受众、阅读优先级、配色、字体排版以及一个有辨识度的结构想法。保留明确要求的风格。若简报信息稀少,选择合理默认值并说明;仅在缺失某项会实质影响结果的决策时才提问。 保持站点标识与文章内容可配置。在归档计数、日期、标签与导航中使用真实文章元数据。在首页之外同步构建阅读体验:一篇包含标题、代码、引用、链接、表格与图片的长文必须在移动端保持舒适可读。 将外壳/导航、首页、文章列表、文章框架与可选大纲拆分为聚焦的 Vue 组件。使用 Vue 3 <script setup lang="ts">;优先使用原生交互与项目既有原语。只暴露已实现的主题选项,并带有类型与默认值。
实现与验证 遵循已安装框架的 ValaxyMain / ValaxyMd、布局与插槽约定。仅浏览器生效的效果应放在 mounted/client 守卫代码中。使用 Valaxy 的文章 API,而不是维护单独的硬编码文章列表。切勿仅为让演示看起来内容丰富而把草稿放入生产归档。 检查真实的包脚本以了解 lint、类型检查、测试与演示构建。对于新主题或渲染改动,明确运行 SSG 构建(valaxy build --ssg 或包含它的脚本);SPA 构建成功不等于 SSG 验证通过。按 starter 要求,在独立类型检查前先生成演示的 Valaxy 声明。检查桌面端与移动端页面、内部导航、文章渲染、外观切换、键盘焦点与空状态。检查控制台/水合错误。若主题预期部署在子目录,测试非根 Vite base。构建成功本身不能验证外观。 打包主题并验证其导出入口与必需源码目录。对于依赖或导出的改动,在全新的消费方中安装归档并构建。更新 README,说明支持的布局/选项、开发命令与实际兼容性。报告已验证内容与仍未完成的部分。生成主题本身并不会把它发布到 npm 或部署站点。