LogoClawIndex
案例技能关于
LogoClawIndex

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。

create-astro-component - 根据网站渲染界面创建原生 Astro 组件

使用线上 HTML、编译后的 CSS、截图和项目规范,将 Jekyll 网站界面重建为整洁的原生 Astro 组件。

标签

更新于: 2026-09-28

能力

典型输入

典型输出

该技能可以做什么

  • 询问还原程度偏好
  • 检查渲染后的 HTML
  • 收集编译后的 CSS 规则
  • 测量桌面和移动布局
  • 判断组件还原契约
  • 创建原生 Astro 组件
  • 应用基于令牌的 SCSS 样式
  • 根据实际用法推导属性

输入

  • 组件范围请求
  • 线上渲染页面
  • 编译后的样式表
  • 桌面和移动端截图
  • 布局测量结果
  • Jekyll 使用位置
  • 用户还原程度偏好

输出

  • Astro 组件源文件
  • 作用域化 SCSS 样式
  • 组件头部注释
  • 更新后的组件实现

要求

  • Astro 项目
  • astro/src/components 目录
  • Sass 包
  • 令牌和断点文件
  • 线上网站访问权限
  • 现代浏览器构建目标

来源

  • 规范: SKILL.md
Astro
Jekyll 迁移
界面组件
SCSS
响应式设计
前端开发
询问还原程度偏好
检查渲染后的 HTML
收集编译后的 CSS 规则
测量桌面和移动布局
组件范围请求
线上渲染页面
编译后的样式表
Astro 组件源文件
作用域化 SCSS 样式
组件头部注释