mirror of
https://github.com/vercel/components.build.git
synced 2026-09-14 20:06:39 +08:00
Hayden Bleasel
55fae375a4
* Update Geistdocs * Update geistdocs.tsx * Run translation script * Delete toc.tsx * Update route.ts * Update route.ts
137 lines
4.7 KiB
Plaintext
137 lines
4.7 KiB
Plaintext
---
|
|
title: 组件市场
|
|
description: 使用组件市场来分享你的组件。
|
|
---
|
|
|
|
组件市场代表了开发者分享和发现 UI 组件的另一种新范式。像 [21st.dev](https://21st.dev) 这样的平台已经出现，作为集中式中心，让创作者可以发布组件，使用者可以无缝发现、预览并安装它们。
|
|
|
|
这些市场将注册表的可访问性与传统包仓库的可发现性结合起来，创建了用于组件共享的充满活力的生态系统。
|
|
|
|
## 市场如何运作
|
|
|
|
当你发布到市场时，平台通常会：
|
|
|
|
1. **托管你的组件代码** - 无需管理你自己的基础设施
|
|
2. **提供统一的 CLI** - 用户通过市场的工具安装组件
|
|
3. **生成预览** - 自动创建实时演示和交互示例
|
|
4. **处理发现** - 搜索、分类和推荐会展示相关组件
|
|
|
|
例如，从 21st.dev 安装使用了熟悉的 shadcn CLI 模式：
|
|
|
|
```bash title="Terminal"
|
|
npx shadcn@latest add https://21st.dev/r/haydenbleasel/dialog-stack
|
|
```
|
|
|
|
市场负责提供组件的元数据和源代码，使安装过程无缝。
|
|
|
|
## 组件市场的优点
|
|
|
|
市场提供的独特优势是注册表或 npm 包单独无法匹敌的。
|
|
|
|
### 对组件作者
|
|
|
|
#### 无需基础设施的分发
|
|
|
|
发布到市场可以消除基础设施方面的顾虑。你不需要为组件设置托管或管理 CDN 分发。
|
|
|
|
市场会处理所有这些，让你专注于创建优秀的组件。
|
|
|
|
#### 内建受众
|
|
|
|
市场会聚合需求。当开发者访问 21st.dev 或类似平台时，他们正积极寻找组件。你的作品会通过搜索、分类和推荐自然被发现。
|
|
|
|
这种内建流量意味着你不需要独立为组件做推广。
|
|
|
|
#### 货币化机会
|
|
|
|
一些市场允许创作者通过高级组件分级、赞助计划、基于使用的定价以及一次性购买模型来货币化他们的作品。
|
|
|
|
这为维护高质量组件创造了可持续的激励。
|
|
|
|
#### 社区反馈
|
|
|
|
市场通常包含评分系统、评论区、使用分析和问题跟踪。
|
|
|
|
这个反馈循环帮助你了解开发者如何使用你的组件以及需要改进的地方。
|
|
|
|
### 对组件使用者
|
|
|
|
#### 精心策划的发现
|
|
|
|
与在 GitHub 或 npm 上搜索不同，市场提供经过策划的体验：
|
|
|
|
```
|
|
Browse by category:
|
|
├── Marketing
|
|
│ ├── Heroes
|
|
│ ├── Pricing
|
|
│ └── Testimonials
|
|
├── Application
|
|
│ ├── Dashboards
|
|
│ ├── Forms
|
|
│ └── Data Display
|
|
└── E-commerce
|
|
├── Product Cards
|
|
├── Cart
|
|
└── Checkout
|
|
```
|
|
|
|
这种组织方式使找到合适的组件显著更快。
|
|
|
|
#### 质量保证
|
|
|
|
许多市场实施审查流程。组件可能需要经过代码质量检查、可访问性审核、性能测试和文档审查。
|
|
|
|
这种策划确保了自助发布组件可能缺乏的基本质量标准。
|
|
|
|
#### 统一工具
|
|
|
|
对所有市场组件使用单一 CLI 简化了工作流程。你可以使用相同的命令安装市场中的任何组件：
|
|
|
|
```bash title="Terminal"
|
|
npx shadcn@latest add https://21st.dev/r/<author>/<component>
|
|
```
|
|
|
|
## 市场的挑战
|
|
|
|
虽然市场提供了引人注目的好处，但它们也带来了独特的挑战。
|
|
|
|
### 对作者
|
|
|
|
#### 竞争与可见性
|
|
|
|
在拥挤的市场中，脱颖而出变得困难。你要与数百个相似组件、拥有粉丝基础的成熟创作者、精选或赞助内容以及算法驱动的推荐竞争。
|
|
|
|
成功不仅需要良好的代码——你还需要引人注目的预览、优秀的文档，并且通常需要积极推广。
|
|
|
|
#### 平台依赖
|
|
|
|
在市场上发布意味着要接受其服务条款、收益分成模式、技术要求和审查流程。
|
|
|
|
如果平台更改政策或关闭，你的分发渠道就会消失。
|
|
|
|
#### 质量压力
|
|
|
|
市场用户期望得到打磨完善、可投入生产的组件。这意味着需要全面的文档、多种演示变体、响应式设计、跨浏览器测试和无障碍合规性。
|
|
|
|
满足这些期望需要大量时间投入，超出仅编写组件代码的范围。
|
|
|
|
### 对使用者
|
|
|
|
#### 质量参差不齐
|
|
|
|
尽管有审查流程，市场质量仍然参差不齐。你可能会遇到依赖过时且被遗弃的组件、文档不充分的代码、在演示中可用但在生产中出问题的组件，以及不同作者之间不一致的编码风格。
|
|
|
|
在选择组件时仍需尽职调查。
|
|
|
|
#### 锁定顾虑
|
|
|
|
尽管市场使用像 shadcn CLI 这样的标准工具，它们可能会引入专有的元数据格式、自定义配置要求和特定平台的依赖。
|
|
|
|
这可能会使迁出市场变得困难。
|
|
|
|
#### 发现悖论
|
|
|
|
过多的选择可能令人不知所措。当寻找一个按钮组件时，找到 200 个选项并不一定有帮助。你需要评估多个相似组件、比较微小差异、评估长期可维护性并考虑作者声誉。
|
|
|
|
这一评估过程可能比自己构建组件耗时更长。 |