component-library
✓全面的 React 組件庫，包含 30 多個使用 shadcn/ui 架構、CVA 變體、Radix UI 原語和 Tailwind CSS 的生產就緒組件。當用戶需要 (1) 創建具有現代模式的 React UI 組件，(2) 構建具有一致設計的完整組件系統，(3) 實現可訪問、響應式、支持暗模式的組件，(4) 通過 React Hook Form 集成生成表單組件，(5) 創建數據顯示組件，如表格、卡片、圖表，或 (6) 構建導航、佈局或反饋組件。提供即時生成的可定制組件，否則每個組件需要 20-45 分鐘進行手動編碼。
SKILL.md
Generate production-ready React components with shadcn/ui patterns, saving 8-10 hours per project.
全面的 React 組件庫，包含 30 多個使用 shadcn/ui 架構、CVA 變體、Radix UI 原語和 Tailwind CSS 的生產就緒組件。當用戶需要 (1) 創建具有現代模式的 React UI 組件，(2) 構建具有一致設計的完整組件系統，(3) 實現可訪問、響應式、支持暗模式的組件，(4) 通過 React Hook Form 集成生成表單組件，(5) 創建數據顯示組件，如表格、卡片、圖表，或 (6) 構建導航、佈局或反饋組件。提供即時生成的可定制組件，否則每個組件需要 20-45 分鐘進行手動編碼。 來源：bbeierle12/skill-mcp-claude。
開啟你的終端機或命令列工具（如 Terminal、iTerm、Windows Terminal 等） 複製並執行以下指令：npx skills add https://github.com/bbeierle12/skill-mcp-claude --skill component-library 安裝完成後，技能將自動設定到你的 AI 程式設計環境中，可以在 Claude Code 或 Cursor 中使用
安全認證，程式碼可靠安全 一鍵安裝，設定簡單 相容 Claude Code、Cursor 等工具
可引用資訊
為搜尋與 AI 引用準備的穩定欄位與指令。
- 安裝指令
npx skills add https://github.com/bbeierle12/skill-mcp-claude --skill component-library- 分類
- </>開發工具
- 認證
- ✓
- 收錄時間
- 2026-02-01
- 更新時間
- 2026-02-18
快速解答
什麼是 component-library？
全面的 React 組件庫，包含 30 多個使用 shadcn/ui 架構、CVA 變體、Radix UI 原語和 Tailwind CSS 的生產就緒組件。當用戶需要 (1) 創建具有現代模式的 React UI 組件，(2) 構建具有一致設計的完整組件系統，(3) 實現可訪問、響應式、支持暗模式的組件，(4) 通過 React Hook Form 集成生成表單組件，(5) 創建數據顯示組件，如表格、卡片、圖表，或 (6) 構建導航、佈局或反饋組件。提供即時生成的可定制組件，否則每個組件需要 20-45 分鐘進行手動編碼。 來源：bbeierle12/skill-mcp-claude。
如何安裝 component-library？
開啟你的終端機或命令列工具（如 Terminal、iTerm、Windows Terminal 等） 複製並執行以下指令：npx skills add https://github.com/bbeierle12/skill-mcp-claude --skill component-library 安裝完成後，技能將自動設定到你的 AI 程式設計環境中，可以在 Claude Code 或 Cursor 中使用
這個 Skill 的原始碼在哪？
https://github.com/bbeierle12/skill-mcp-claude
詳情
- 分類
- </>開發工具
- 來源
- skills.sh
- 收錄時間
- 2026-02-01