shadcn-ui

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

shadcn/ui

shadcn/ui is a collection of accessible, composable React components built on Radix UI primitives and styled with Tailwind CSS — components are copied into your project via CLI, giving you full ownership of the source code.

shadcn/ui是一组基于Radix UI基础组件、采用Tailwind CSS样式的可访问、可组合React组件集——组件可通过CLI复制到你的项目中，让你完全拥有源代码的所有权。

Documentation

文档

Docs: https://ui.shadcn.com/llms.txt

文档：https://ui.shadcn.com/llms.txt

Best Practices

最佳实践

Form components include React Hook Form and Zod — do not add separate form libraries. The
```
Form
```
component wraps
```
react-hook-form
```
with built-in Zod validation. Adding
```
formik
```
,
```
react-final-form
```
, or additional validation packages is redundant.
components.json
controls path aliases, Tailwind config, and component style — always check this file exists and is correctly configured before adding components. An incorrect
```
tailwind.config
```
path or missing CSS variable setup in
```
globals.css
```
causes components to render without styles.
There is no "update all" command —
```
shadcn add
```
and
```
shadcn diff
```
operate per-component. When suggesting upgrades, list each component individually; bulk update scripts must be written manually.

表单组件已包含React Hook Form和Zod——请勿添加独立的表单库。
```
Form
```
组件封装了
```
react-hook-form
```
并内置Zod验证。添加
```
formik
```
、
```
react-final-form
```
或其他验证包属于冗余操作。
components.json
控制路径别名、Tailwind配置和组件样式 ——在添加组件前，请务必确认该文件存在且配置正确。
```
tailwind.config
```
路径错误或
```
globals.css
```
中缺少CSS变量设置会导致组件无样式渲染。
没有「全部更新」命令 ——
```
shadcn add
```
和
```
shadcn diff
```
按单个组件操作。建议升级时，请逐个列出组件；批量更新脚本需要手动编写。