阿玛·斯丁林 MCP
[尖叫声] 实验
说明
一个MCP(Model Context Protocol)服务器,向AI助理披露设计符元数据,以进行符号发现并推荐.
上面写着: styling.metadata.json 文件并提供了用于列出、过滤和寻找CSS中最佳设计符号的工具.
工具
| 工具 | 说明 |
|---|---|
list_design_tokens | 列出可用的设计符号及其描述,值,类型,类别和标记. 支持按类别,标签,类型,或名称模式(regex)进行可选过滤. |
find_design_token | 鉴于CSS属性和语义上下文,建议使用最好的匹配设计符来代替硬编码值. |
如何使用 VSCode
要添加 Design Tokens MCP 服务器, 您应该首先使用 "chat.mcp.enabled": true。 。 。 .
然后,在你身边 .vscode/mcp.json 添加:
{
"AmaStyling": {
"type": "stdio",
"command": "npx",
"args": [
"-y", "-p", "@ama-styling/mcp", "ama-styling-mcp-start",
"--metadata", "./path/to/styling.metadata.json"
],
"env": {
// Help us improve Otter by setting this to true.
// More details on our privacy policy: https://github.com/AmadeusITGroup/otter/blob/main/PRIVACY.md
"O3R_METRICS": true
}
}
}
CLI 选项
| 选项 | 说明 | 默认 |
|---|---|---|
-m, --metadata <path> | 路径 styling.metadata.json 文件 | ./styling.metadata.json |
--cache-path <path> | 缓存文件路径 | .cache/@ama-styling/mcp |
--log-level <level> | 日志级别 : debug, (中文(简体) ), info, (中文(简体) ), warn, (中文(简体) ), error | info |
元数据文件格式
服务器期望有一个JSON文件,其结构如下:
{
"variables": {
"--color-primary": {
"name": "--color-primary",
"defaultValue": "#3b82f6",
"type": "color",
"category": "brand",
"tags": ["primary", "interactive"],
"description": "Primary brand color for interactive elements",
"label": "Primary Color"
}
}
}
每个可变条目支持:
| 外地 | 类型 | 说明 |
|---|---|---|
name | string | CSS 自定义属性名( 需要) |
defaultValue | string | 变量的默认值( 需要) |
type | "color" | "string" | 数值类型 |
category | string | 键类 |
tags | string[] | 分类标签 |
description | string | 人可读描述 |
label | string | 显示标签 |
references | CssVariable[] | 其他符号此可变引用 |
component | { library, name } | 构成部分关联 |
[注] 此元数据文件通常是由
@ama-styling/style-dictionary包件作为设计符号构建管道的一部分.