
ReactFrame
io.github.AhmetLoca由 GitHub 账号 AhmetLoca 发布v0.2.1更新于 Oct 24, 2026
Search ReactFrame's React + Tailwind + Motion components, install free ones and price premium picks.
概览
让编程助手搜索 ReactFrame 的 React、Tailwind 和 Motion 组件库,安装免费组件并为付费组件报价。
- 可以做什么
- 封装 ReactFrame 的公开组件注册表,让助手可以按关键词、分类、类型或仅免费等条件搜索组件、区块和页面。它能以 shadcn 注册表格式获取免费组件的完整源码,包括文件、npm 依赖和安装命令,并在有提供时返回现成的重建提示词。付费条目会连同价格出现在搜索结果中,但源码无法获取,因此助手只留下占位符,并用报价工具为整个构建计价。
- 适用场景
- 适合在用 Tailwind 和 Motion 构建 React 界面时,希望助手把真实组件源码拉进项目,而不是全部从头编写。也适合在动手前估算一个混合免费与付费组件的设计方案的成本。
- 运行要求
- 通过 stdio 在本地运行,通常用 npx 从 npm 包 reactframe-mcp 启动,因此需要 Node.js 以及访问 reactframe.com 的网络。未声明账号、API 密钥或环境变量;可选设置 REACTFRAME_BASE_URL 指向本地实例。
安装
在 SourceWeft 中
- 打开 控制台中的 ReactFrame,将其添加到工作区。
- 为需要使用其工具的对话启用该服务。
Desktop only,通过 STDIO。 STDIO 服务会启动本地进程,因此需要 SourceWeft 桌面宿主。
其他 MCP 客户端
参照 仓库 中的启动说明。
README
reactframe-mcp
An MCP (Model Context Protocol) server for ReactFrame — search and pull the full source of free React + Tailwind CSS + Motion components, blocks and pages directly into a coding agent, with no browser round-trip.
It wraps the same public data as reactframe.com/llms.txt and the r/<slug>.json registry mirror shadcn's CLI already uses. Free components install straight into your project. Premium components show up in search with their price; their source isn't fetchable from here, so the agent leaves a placeholder and prices them with get_quote instead.
Build a site with it
Ask your agent something like "Build me a landing page for my coffee shop with ReactFrame components." It picks components from the catalog, installs the free ones, marks where premium ones go, and ends with a quote: which premium components the design uses, what they cost, and whether All-Access is the better deal.
Tools
- search_components — keyword search across name/description/category/slug, with
category,type(element/block/component/page) andfreeOnlyfilters. Premium results include their price. - get_component — fetch a free component's full source (files, npm deps, install command) in shadcn registry format, by slug.
- get_rebuild_prompt — fetch the ready-made "rebuild this from scratch" AI prompt for the free components that ship one.
- list_categories — list every category with component/page counts, useful before a targeted search.
- get_quote — price every component and page a build uses in one call: free items with their install command, premium ones with their price, the premium total, and whether All-Access is cheaper.
Add it to Claude Code
Add it to Cursor / other MCP clients
Add to your MCP config (e.g. ~/.cursor/mcp.json):
Local development
REACTFRAME_BASE_URL overrides the default https://reactframe.com — point it at a local npm run dev of the main app while iterating. npm run test:tools spawns the built server over stdio with the real MCP SDK client and calls every tool, the same way a real client would.
来源:mcp-server/README.md,提交 c09009e
工具
0版本历史
1- v0.2.1最新Sep 26, 2026
评分
已满足适用检查项的 50%
该评分衡量此收录条目的完整程度,依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价,也不表示服务器安全或当前可用:可连通性是带日期的检查结果,评分也不包含安装量或用户评价。
- 近 30 天内可连通25 分
请保持端点能够响应 MCP 握手;SourceWeft 每 30 天探测一次。
- 已声明认证方式10 分
请在注册中心条目中声明凭据请求头,或保持端点能够响应探测,以便判定其认证方式。
- 已列出工具15 分
请让服务器在无凭据时响应 tools/list,或发布可在沙箱中无凭据启动的软件包。
- 描述必需15 分
- 图标10 分
- 文档15 分
- 许可证10 分

