mcpField
L
lynx-api-docs

lynx-api-docs

github.com/lynx-community开发28153 次安装1 天前更新
代码仓库

关于 lynx-api-docs

lynx-api-docs 是用于编写和修改 Lynx 页面代码的文档指导技能。它要求开发者先查阅已安装的相关 API 文档，避免照搬 Web 平台的假设。

主要功能

  1. 01按任务查找文档
  2. 02Lynx 布局与 CSS 指引
  3. 03元素和选择器参考
  4. 04Web 到 Lynx 迁移指引
  5. 05编辑前查阅文档

适用场景

  1. 01编写样式前检查 CSS 支持情况
  2. 02选择 Lynx 布局系统
  3. 03修改前核实元素 API
  4. 04将 Web 代码迁移到 Lynx

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/lynx-community/skills --skill lynx-api-docs

安装后在 Claude Code 中输入/lynx-api-docs确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

best-practices.md
css/
pseudo-classes.md
selectors.md
supported-properties.md
values-and-units.md
elements/
blur-view.md
image.md
input.md
list.md
overlay.md
page.md
refresh.md
scroll-coordinator.md
scroll-view.md
svg.md
text.md
textarea.md
view.md
viewpager.md
webview.md
examples/
bottom-nav.md
card-list.md
sidebar-layout.md
sticky-header.md
waterfall.md
layout/
flex-layout.md
grid-layout.md
linear-layout.md
relative-layout.md
lynx-vs-web/
css-differences.md

详细介绍

使用 Lynx API 文档

概述

仅凭预训练知识不足以掌握 Lynx。 Lynx 是一个渲染平台（类似浏览器），拥有自己的元素、非标准 CSS 行为、独特的布局系统，以及与 Web 不兼容的默认设置。编写或修改 Lynx 页面代码前，务必先查阅已安装的 API 文档。

核心规则

编写或编辑任何 Lynx 代码前，必须始终阅读相关 API 文档。

不要依赖 Web CSS 知识。不要假设标准 HTML 行为。不要猜测元素 API。Lynx 是一个有自身规则的独立平台。

为什么 Web 知识会失效

Lynx 不是 Web 浏览器。对 Web 的想当然会导致 Lynx 代码出错：

  • 元素：<view>、<text>、<image>，而不是 <div>、<span>、<img>
  • CSS 默认值：box-sizing: auto 通常使用 border-box 盒模型；不会发生外边距合并；默认使用线性布局（而不是流式布局）
  • 属性：许多 CSS 属性不受支持或行为不同——务必查阅 css/ 文档

每一个对 Web 的想当然都可能导致错误。

如何使用文档

  1. 确定你要处理的内容（布局、CSS、元素、迁移、模式）
  2. 从下表中查找相关文档文件
  3. 编写或编辑代码前阅读文档
  4. 应用文档中的规则和限制
  5. 如有疑问，请搜索 elements/ 或 css/ 目录

快速参考

任务首先阅读这些文件
选择布局layout/linear-layout.md（默认）、layout/flex-layout.md、layout/grid-layout.md、layout/relative-layout.md
CSS 属性/单位css/supported-properties.md、css/values-and-units.md
CSS 选择器css/selectors.md、css/pseudo-classes.md
使用元素elements/<element-name>.md
从 Web 迁移lynx-vs-web/migration-guide.md、lynx-vs-web/css-differences.md
主题/动画/响应式设计patterns/theming.md、patterns/animation.md、patterns/responsive.md
常规查阅quick-reference.md、best-practices.md

核心规则

精简版布局决策规则和关键 CSS 限制记载于 quick-reference.md。最重要的规则：

  • 文本必须使用 <text> 组件
  • 盒模型初始使用 auto，通常采用 border-box 盒模型；如果兼容性设置可能不同，请指定明确的值
  • 不会发生外边距合并
  • 使用 rem + vw 适配屏幕

危险信号——立即停止并阅读文档

  • 添加 <div> 或 <span> → Lynx 使用 <view>、<text>
  • 使用 margin 却未检查是否会发生外边距合并 → 不会发生
  • 假设使用 content-box → auto 通常采用 border-box 盒模型；请查看 css/supported-properties.md#box-model
  • 使用 Web CSS 属性却未查看 css/supported-properties.md
  • 猜测元素属性 → 阅读 elements/<name>.md
  • 为可移植到 Web 的代码选择 rpx → rpx 是 Lynx 专用单位；为兼容 Web，请使用 rem + vw
  • 编写纯文本却未使用 <text> 包裹 → 在 Lynx 中无效
  • 使用 Web 伪类却未查看 css/pseudo-classes.md
  • 假设使用标准 HTML 流式布局 → Lynx 默认使用线性布局

评论

支持 Markdown