@21st-dev/cli

中文文档
1.18.0发布于 2026/10/07MITES Module零依赖近 30 天下载 3.5万

第21回CLI:从您的终端搜索,取回并安装第21回.dev组件,并为您的编辑器配置第21回MCP.

中文使用文档
文档目录7 节
  1. 安装
  2. 签名
  3. 图标
  4. 如何运作
  5. 1.17.1 联合国
  6. 文档
  7. 许可证

第21次全国学习

搜索、检索、安装 发表 第21届 从您的终端生成组件、主题和模板,用 21 第 AI 生成 UI,并将 21 第 MCP 线接入您的编辑器。 CLI与第21个MCP共享一个端点和一个登录,因此每个命令都准确返回一个MCP客户端(Cursor,Claude等)所看到的.

一个统一的CLI. @21st-dev/cli (宾) 21st)现在是每件事情的单一工具. 它取代了老年人 @21st-dev/registry (印刷/安装)和 @21st-dev/magic (Magic MCP)软件包——使用 21st 对于所有它。 旧 @21st-dev/magic 配置继续工作:自0.2.0起,该软件包是这个CLI配置的同为第21个MCP端点的稀疏代用.

安装

npm i -g @21st-dev/cli
# or run without installing:
npx @21st-dev/cli search "pricing table"

签名

21st login      # opens your browser, saves a token locally (~/.config/21st)
21st whoami     # show the signed-in account
21st usage      # retrieval tier/quota + hosted AI access
21st usage --json # structured account capabilities, including aiGenerationEnabled

API 密钥认证 https://21st.dev/ settings/api-keys (英语) 通过 TWENTYFIRST_TOKEN (或 API_KEY_21ST(原始内容存档于2012-10-12) (中文(简体) ). env var, or the --api-key <key> 编号 : --token <key> 旗帜。 一个退休的 an_… 内存中的密钥被跳过,所以它不能阴影一个工作 21st login 届会.

图标

命令它会做什么
21st search <query> [--type component|theme|template] [--context auto|path] [--tag] [--color] [--sort] [--json]搜索元数据; 设计上下文会增加信心和合适的原理.
21st logo <query> [--limit N] [--json]搜索品牌+UI SVG标识. 免费, 不需要登录 .
21st get <id> [--json]以搜索id(metered)打印一个组件的代码+演示.
21st theme <id> [--json]以搜索id来打印一个主题的CSS——免费.
21st add <user>/<slug> [--print]通过 21 阴影登记册安装组件.
21st bookmarks [--type ...] [--limit N] 编号 : 21st bookmark <id> --type <kind> [--remove]列出/ 添加/ 删除任何实体的书签 ("心") .
21st lists 编号 : 21st list <listId> 编号 : 21st list-new <name> 编号 : 21st list-add <listId> <id> --type <kind> [--remove]管理命名的书签列表 .
21st teams 编号 : 21st team <teamId> 编号 : 21st team-lists <teamId> 编号 : 21st team-components <teamId> [--library <id>]浏览您的团队共享库 + 列表 .
21st components [--status all|draft|published|private] [--scope all|personal|team:<uuid>] [--json]列出每个无障碍的个人/团队组件和自有草稿,使用稳定的参考.
21st open <component:<id>|draft:<uuid>> [--no-open]恢复现有组成部分的草案或创建/恢复经过审查的修订; --no-open 打印其 URL.
21st publish <Component.tsx> [--component component:<id>] --description "…" [--to <library-slug>] [--preview <image>] [--no-open]创建草案,开放 CLI Review 有活地演示和自动媒体,然后发布新的组件或明确拥有的修订版.
21st submit <slug> 编号 : withdraw 编号 : resubmit 编号 : remove-from-catalog管理目录审查与出版/私人访问分开.
21st publish-theme <theme.css> --name "…" [--tags a,b]发布主题( CSS 为 :root + 键 .dark) (中文(简体) ).
21st publish-template <name> --site <url> --preview <img-url> [--price N]提交模板清单供审查.
21st publish-gradient <recipe.json> --name "…" --thumbnail <image>发布 API 密钥范围的渐变构建器 .
21st publish-ascii <recipe.json> --name "…" --thumbnail <image> [--video <file>] [--mask <file>] [--private]将 ASCII 配方发布到 API 密钥的范围 .
21st edit component:<id> --type component [...] 编号 : 21st delete component:<id> --type component --yes编辑或卸载库存返回的确切组件,包括可管理的团队组件.
21st edit <id> --type <theme|template> [...] 编号 : 21st delete <id> --type <theme|template> --yes使用它现有的API-key-scoped id sematics编辑或删除一个主题/模板.
21st delete draft:<uuid> --type draft --yes永久删除自有草稿及其未公布的沙盒.
21st publish <file> --prepare [--wait-video] [--media-dir <dir>] 编号 : 21st publish <file> --draft draft:<uuid> --auto [--wait-video]无头流:在不出版的情况下准备有修订约束的媒体,然后完全从CLI中发表准确的草稿.
21st profile get [--json] 编号 : 21st profile set --file <path.json> [--clear] 编号 : 21st profile upload <image>读取、替换或清除您的便当配置板并上传媒体(需要a) 21st_sk_… API 密钥).
21st inspiration-feedback <feedbackId> --outcome accepted|rejected记录一个保护隐私的灵感决定.
21st generate "<prompt>" [--context auto|path] [--variants N]以主机 21 第 AI 访问和 AI 信用生成被禁选项,然后打开其预览.
21st generation <projectId> 编号 : 21st iterate <projectId> "<change>" [--take N] 编号 : 21st take <projectId> [--take N] [--code] [--select]列出草图一代的取取,精炼取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取取generation编号 :take ”) .
21st init --design-context [--check|--refresh]创建或验证 .21st/design.json 财务报告和审定财务报表 .21st/DESIGN.md。 。 。 .
21st review <path...> [--fix] [--json]运行决定性的地方UI审查和保守修正.
21st skills install|list|check|update|remove管理Claude、Cursor和Codex经核实的技能.
21st skills catalog被检查的相容性; 广泛的发现保留在技能上.sh.
21st install-skill兼容性别名 21st skills install --global。 。 。 .
21st init --client <name> [--write]打印或写入编辑器的第21个MCP配置.
21st login 编号 : logout 编号 : whoami 编号 : usage [--json]管理您的本地会话, 并查看检索配额加托管的 AI 访问 .

对于一个新的组件弹壳, publish 打开专门的 CLI 评论并等待其最后的出版行动。 审查显示现场选取的演示和全部演示计数. 它首先开始一个需要的封面,并尝试在后台播放一个可选的最好效果的视频;出版时一直被锁定,直到每个演示都有一个有效的封面,但不等待视频. 视频只有在需要的交互产生可见结果时才被接受,所以交互控制应该暴露出稳定的语义选择器,如 id,本地角色,或 data-slot。包含一个现成的视频,生成的媒体总是可以手动替换。 CLI还拒绝非便携式主题表达,例如: oklch(var(--primary)); 使用 bg-primary 或者说 var(--color-primary)。 。 。 . --preview 初步封面,但不绕过确认 --no-open 打印审查 URL而不启动。 目前CLI命令种子一个自成一体组件和一个演示;审查本身支持多个演示. 在 CI 中, 命令打印结构化的草稿结果和带有代码的退出 2 而不是等待着。 两者a 21st login 会话和真实的 API 密钥( E)21st_sk_… 从 https://21st.dev/ settings/api-keys (英语)用于部分出版和部分元数据管理。 主题/模板管理保留了它现有的API-键语义.

21st components 在打印前排出两个独立的服务器光标, 因此默认值 --status all --scope all 产出包含每个无障碍的个人或团队部分和每个自有草稿,而不是一页样本. 21st open draft:<uuid> 重新起草该草案. 21st open component:<id> 从所保留的已公布组件代码和演示创建或恢复服务器拥有的 CLI Review 修订;活的组件保持不变,直到修订发布. 改版需要新鲜封面,而可选视频生成则在背景中运行最佳. --no-open 创建或恢复工作空间,并在不启动浏览器的情况下打印其URL.

只有原始组件作者才能检查出代码修订. 一个团队管理器仍然可以编辑或解开一个团队的组员的元数据 component:<id> 参考: 如果保留源、 依赖性、 样式、 支持文件, 或默认演示无法安全复制, 退出失败 ; 使用 21st publish <file> --component component:<id> 带有本地源文件。 证明有根据的遗留的CLI草案被收回到清单中,以便其经过认证的范围;可能还需要重新拟订一份其范围无法证明的旧的未签字草案。 库存、组件取出和组件元数据编辑/删除 21st login 会话或 API 密钥。 主题/模板管理保持其API键要求.

--client 接受 cursor, (中文(简体) ), claude, (中文(简体) ), codex, (中文(简体) ), vscode,或 devin (Devin桌面,原为Windsurf; windsurf 仍被接受为别名)。 与 --write,这个配置是 合并 输入您已有的 MCP 配置( 它不会将其它服务器弹出) .

如何运作

搜索和所有元数据/列表命令都是免费的;检索一个组件的代码(21st get,或MCP get_component ——主题也可以自由检索。 签入免费账户可获得少量每日组件代码津贴,然后立即升级;成员可获得无限检索。 私人/团队组件由团队成员组成,而不是进行干扰.

Hosted 21st AI是一个独立的能力: Builder组件访问单靠无法实现 generate 或者说 iterate检查 21st usage --json 生成前;仅 aiGenerationEnabled: true 并且这个字段没有报告剩下的AI信用余额. 关闭AI,使用 21st search 财务报告和审定财务报表 21st get,然后用自己的编码代理来调整返回的代码。 现有的几代人仍然可以读取 21st generation 财务报告和审定财务报表 21st take。 。 。 .

MCP隐藏 generate 财务报告和审定财务报表 iterate_generation 当AI访问关闭。 缓存呼叫和直接 CLI 命令返回 ai_subscription_required 带有使用搜索和组件检索的指引; 在启用 AI 访问之前不要重试生成 。 启用 AI 后刷新 MCP 工具列表或重新连接 . generate --json 财务报告和审定财务报表 iterate --json 保留拒绝理由并退出非零.

1.17.1 联合国

  • 21st usage --json 现在返回 MCP 的结构化账户能力,包括服务器报告时的主机AI访问.
  • 澄清了组件检索的单独要求并托管了AI,包括使用自己的编码代理与AI关闭的工作流程.

文档

全体导游现场直播 帮助21st.dev/cli —— 说 出版 (每个旗帜,退出代码和失败模式), 查找和安装, (中文(简体) ), 第21次 大赦国际, (中文(简体) ), 项目意识设计,则 命令引用。 。 。 .

许可证

麻省理工学院第21届Dev

版本与发布记录

@21st-dev/cli 共发布 66 个版本,首次发布于 2025/03/25;过去 12 个月发布了 42 个版本。

版本发布日期距今
1.18.0latest2026/10/0730 天前
1.17.12026/09/101 个月前
1.17.02026/09/012 个月前
1.16.12026/08/272 个月前
1.16.02026/08/212 个月前
1.15.22026/08/202 个月前

其他发布通道:beta → 1.1.5。

关于 @21st-dev/cli 的常见问题

@21st-dev/cli 是什么?

第21回CLI:从您的终端搜索,取回并安装第21回.dev组件,并为您的编辑器配置第21回MCP.

如何安装 @21st-dev/cli?

在项目目录运行 npm install @21st-dev/cli,或使用 pnpm add / yarn add / bun add。它还提供命令行工具 21st,可以用 npx 21st 直接运行。

@21st-dev/cli 支持 TypeScript 吗?

该包的 package.json 没有声明类型入口。需要类型提示时,可以在 npm 上查找社区维护的 @types/21st-dev__cli 是否存在。

@21st-dev/cli 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@21st-dev/cli 需要什么版本的 Node.js?

package.json 的 engines 字段要求 Node.js >=18。版本不符时 npm 默认只给出警告,开启 engine-strict 后会拒绝安装。

@21st-dev/cli 可以商用吗?

@21st-dev/cli 使用 MIT 许可。宽松许可:允许商业使用、修改和再分发,通常只需在分发时保留原版权与许可声明。以上为概括,不构成法律意见,请以许可原文为准。

@21st-dev/cli 的下载量有多少?

根据 npm 官方下载统计,@21st-dev/cli 在 2026/10/05 – 2026/11/03 这 30 天内被下载 35,215 次,日均约 1,174 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@21st-dev/cli 还在维护吗?

最新版本 1.18.0 发布于 2026/10/07(30 天前);至今共发布 66 个版本,其中过去 12 个月发布了 42 个;首次发布于 2025/03/25。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。