Agent Skills
› tabler/tabler
tabler/tabler
GitHub用于启动 Astro 开发服务器并自动验证前端变更。支持多包环境,处理热更新、样式构建及交互测试,确保页面状态正确,避免手动检查。
Install All Skills
npx skills add tabler/tabler --all -g -y
Skills in Collection (21)
用于启动 Astro 开发服务器并自动验证前端变更。支持多包环境,处理热更新、样式构建及交互测试,确保页面状态正确,避免手动检查。
需要验证前端组件或页面变更
开发服务器出现异常如资源丢失或样式未刷新
npx skills add tabler/tabler --skill astro-dev -g -y
用于为 Tabler 文档组件页面编写或更新 classnames front matter,以渲染类参考表。当组件增加/减少类或用户请求时触发,需遵循严格 schema 和分类规则。
组件页面需要添加类列表
组件在 core/scss/** 中增减了类
用户请求类参考、类表或 classname 块
向现有组件添加新类后
npx skills add tabler/tabler --skill class-reference -g -y
负责 Tabler 框架核心 JavaScript 代码(tabler.js/tabler-theme.js)及 Bootstrap 组件移植的开发与维护。用于新增行为、修复 JS 逻辑或调整主题切换器,强调保持与上游同步及包体积优化。
需要添加或修复 Tabler 前端交互行为
处理 Bootstrap 组件的 JS 错误
修改 core/js/src/ 目录下的源码
npx skills add tabler/tabler --skill core-js -g -y
指导 Tabler 框架 core/scss 目录的样式开发规范,涵盖组件结构、CSS 自定义属性模式及构建前缀处理。
需要为组件添加新类名或变体
修改 SCSS 变量或自定义属性
涉及暗色模式或 RTL 行为
编辑核心配置或 UI 文件
npx skills add tabler/tabler --skill core-scss -g -y
用于构建或更新 Tabler 组件的演示页面,展示变体对比。涵盖页面骨架、头部配置及卡片网格布局,适用于新增组件预览页或清理现有演示页面的场景。
用户要求添加或扩展演示页面
新增 shared/ui 组件且无对应预览页
需要清理或整理 demo 页面
npx skills add tabler/tabler --skill demo-pages -g -y
根据代码变更自动生成 Changeset 文件,用于版本管理和发布说明。通过 git 分析确定影响范围、包及版本号,生成符合规范的描述文本。
用户请求生成 changeset
版本升级或发布说明需求
准备提交或创建 PR 时自动触发
npx skills add tabler/tabler --skill generate-changeset -g -y
基于 Git 差异自动生成 MR/PR 标题和描述,支持对比 origin/dev、提取提交日志与变更统计,智能处理现有 PR 关联及 Vercel 预览链接。
用户请求生成 Merge Request 或 Pull Request 的描述文本
需要总结当前分支相对于主分支的代码变更内容
npx skills add tabler/tabler --skill mr-description -g -y
指导为Tabler预览页面选择合适的布局并配置,涵盖DefaultLayout的props、chrome标志及各类布局适用场景。用于统一页面结构,避免手写HTML骨架。
需要为页面选择或创建新布局时
修改页面头部、侧边栏或主体样式时
添加新的layout文件前
npx skills add tabler/tabler --skill page-layouts -g -y
用于生成Tabler组件或页面的截图,支持发布说明、网站和社交宣传。涵盖布局选择、页面编写、状态展示及捕获流程。
需要为新组件或页面制作截图
设计变更后需重新拍摄现有组件截图
处理 screenshots/ 目录下的图片资源
npx skills add tabler/tabler --skill screenshots -g -y
指导在 Astro 框架中构建和扩展共享 UI 组件,涵盖 Props 设计、类名组合、插槽处理及文档同步。
创建新的共享 UI 组件
为现有组件添加新属性或变体
重构共享组件逻辑
npx skills add tabler/tabler --skill ui-component -g -y
提供基于 Bootstrap 5 的 Tabler UI 套件使用指南,涵盖安装、页面布局及组件开发。指导 Agent 通过文档获取精确类名构建管理后台与仪表盘界面,确保样式一致性与正确性。
需要构建管理后台或仪表盘界面
项目使用了 @tabler/core 包
询问关于 Tabler 组件的使用或安装
npx skills add tabler/tabler --skill tabler -g -y
规范 Astro 组件中客户端脚本的编写,确保使用 inline script 避免打包,通过 CaptureScript 机制在 body 末尾同步注入脚本,解决初始化时机、类型安全及并发渲染隔离问题。
需要为 Astro 组件添加客户端交互逻辑
初始化第三方 JS 库或 Bootstrap 插件
修复脚本未执行或打包错误的问题
npx skills add tabler/tabler --skill astro-scripts -g -y
规范前端组件库向后兼容性,定义公共API边界,确保补丁和次要版本不破坏用户代码。指导别名处理、废弃管理及兼容性检查流程。
修改或删除类名、CSS变量、Sass函数等公共API
重构核心代码导致旧接口失效
评估变更是否需要大版本发布
npx skills add tabler/tabler --skill backward-compat -g -y
指导在 Bootstrap JS 移植项目中创建符合规范的 TypeScript 组件类,涵盖文件结构、类型定义、配置合并及 Data API 实现。
需要创建新的 Bootstrap 风格组件
要求将现有组件提升至当前代码基线标准
npx skills add tabler/tabler --skill bootstrap-component -g -y
解析并修复 Tabler 资产构建管道,涵盖 Astro、Vite/Terser 及 Turborepo 依赖图。用于解决资源缺失、重复、404 或构建输出异常等问题,指导正确配置 copy-assets 集成与目录权限。
资产文件缺失、陈旧或重复
页面出现 404 错误
重启后观察者输出消失
需要编辑构建脚本或配置
npx skills add tabler/tabler --skill build-pipeline -g -y
通过对比渲染前后 HTML 字节一致性,验证重构或代码调整是否意外改变了输出。用于安全地提取组件、重命名属性或重构布局,确保页面渲染结果不变。
验证重构是否改变 HTML 输出
检查组件提取或重命名是否安全
确认布局重构的字节一致性
npx skills add tabler/tabler --skill html-diff -g -y
指导Agent撰写或更新GitHub版本发布说明的引导部分。通过收集changeset、PR和文档事实,按照固定布局生成包含封面、头条功能及升级指南的介绍内容。
用户请求编写或更新版本发布说明
询问新版本特性
发现小版本发布的介绍文件缺失
npx skills add tabler/tabler --skill release-notes -g -y
用于生成或更新 Tabler 版本的升级指南,涵盖收集变更事实、页面结构及验证规则。适用于迁移指南、发布说明或版本对比场景。
用户请求迁移或升级指南
询问特定版本破坏性变更
发布前检查 changeset 中的移除或重命名项
npx skills add tabler/tabler --skill upgrade-guide -g -y
用于为 Tabler UI 库编写、更新或建议文档页面。遵循 MDX 结构和简单英语规范,支持直接编辑或主动发现未文档化的组件并提示用户。
用户要求创建、编辑或标准化文档
检测到新增或变更的 UI 组件/插件缺乏对应文档
npx skills add tabler/tabler --skill write-docs -g -y


