这不是组件库。它是可重复使用的组件的集合,您可以将其复制并粘贴到您的应用程序中。
不是组件库是什么意思?
意思是您不用将其安装为依赖项。它不通过 npm 分发。
选择您需要的组件。将代码复制并粘贴到您的项目中,并根据您的需求进行自定义。代码是你的。
将它作为构建您自己的组件库的参考。
常见问题
为什么采用复制/粘贴而不打包为依赖项?
其背后的想法是赋予您对代码的所有权和控制权,允许您决定如何构建组件和设计样式。
从一些合理的默认值开始,然后根据您的需要自定义组件。
将组件打包在 npm 包中的缺点之一是样式与实现耦合。组件的设计应该与其实现分开。
您打算将其发布为 npm 包吗?
没有计划将其发布为 npm 包。
支持哪些框架?
您可以使用任何支持 React 的框架。Next.js、Astro、Remix、Gatsby等。
我可以在我的项目中使用它吗?
是的。免费用于个人和商业项目。
安装
下面是如何安装依赖项并构建您的应用程序。
框架
TypeScript
该项目和组件是用 TypeScript 编写的。我们建议您的项目也使用 TypeScript。
不过,我们也提供了组件的 JavaScript 版本。JavaScript 版本可通过cli获得。
要选择退出 TypeScript,您可以在components.json
文件中用tsx
做到。
{ "style": "default", "tailwind": { "config": "tailwind.config.js", "css": "src/app/globals.css", "baseColor": "zinc", "cssVariables": true }, "rsc": false, "tsx": false, "aliases": { "utils": "~/lib/utils", "components": "~/components" } }
要配置导入别名,您可以使用jsconfig.json
:
{ "compilerOptions": { "paths": { "@/*": ["./*"] } } }
来自: