如何用 shadcn eject 把 shadcn/tailwind.css 内联进全局样式并移除 shadcn 包依赖【免费下载链接】uiA set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.项目地址: https://gitcode.com/GitHub_Trending/ui/ui如果你的项目通过 shadcn CLI 的init初始化过全局 CSS 文件里会有一行import shadcn/tailwind.css;这意味着项目依赖了shadcn包来提供这部分样式。当你不希望保留这个依赖时shadcn eject命令可以把shadcn/tailwind.css的内容直接内联进全局 CSS 文件并把shadcn依赖从项目中移除。本文基于仓库内的 CLI 文档eject 章节/cli.mdx)和 2026 年 5 月的更新说明2026-05-shadcn-eject.mdx给出完整的操作路径。先弄清 shadcn/tailwind.css 提供了什么了解要内联的内容才能在操作后确认样式没有缺失。shadcn 在同时支持 Radix 和 Base UI 两套组件库时需要一个存放两者共同依赖的 Tailwind 工具类的地方例如data-open:、data-closed:这类自定义 variant 和no-scrollbar这类 utilityRTL 支持开发中遇到的一些 bug 也更适合在这个共享位置统一修复而不是在每个组件里重复。shadcn/tailwind.css就是为这些内容创建的。运行init后它被添加为全局 CSS 中的一行 import。文档说明它的工作方式与tw-animate-css等其他 CSS import 一致一个小的依赖包在生产构建中被 tree-shake并在构建时解析。CLI 文档对它的描述是提供共享的 Tailwind v4 utilities包括自定义 variantdata-open:、data-closed:等和 accordion 动画。运行 eject 前的检查项目已经过init初始化或按手动安装文档配置过样式全局 CSS 文件中存在import shadcn/tailwind.css;这一行。被修改的目标文件是components.json中tailwind.css配置项指向的全局 CSS 文件命令会改写这个文件建议先确认它的内容已提交或可回滚。在 monorepo 中components.json和全局 CSS 文件位于同一个 workspace 内命令需要指向该 workspace。执行内联并移除依赖在项目根目录全局 CSS 所在目录运行npx shadcnlatest eject该命令做两件事把shadcn/tailwind.css内联进全局 CSS 文件并从项目中移除shadcn依赖。monorepo 场景如果components.json和全局 CSS 在某个子 workspace 里用-c指定工作目录从包含这两个文件的 workspace 运行npx shadcnlatest eject -c packages/ui-c packages/ui中的路径按你实际的 workspace 目录替换。完整参数如下来自 CLI 文档Usage: shadcn eject [options] inline shadcn/tailwind.css and remove the shadcn dependency Options: -c, --cwd cwd the working directory. defaults to the current directory. -y, --yes skip confirmation prompt. (default: false) -s, --silent mute output. (default: false) -h, --help display help for command-y用于跳过确认提示-s用于静音输出交互运行时默认会先出现确认提示。验证结果文档给出的 before / after 对比以下为文档示例运行前import tailwindcss; import tw-animate-css; import shadcn/tailwind.css;运行后文档示例import tailwindcss; import tw-animate-css; /* ejected from shadcn4.8.3 */ theme inline { keyframes accordion-down { from { height: 0; } to { height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) ); } } } custom-variant contenteditable="false">【免费下载链接】uiA set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.项目地址: https://gitcode.com/GitHub_Trending/ui/ui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 如何用 shadcn eject 把 shadcn/tailwind.css 内联进全局样式并移除 shadcn 包依赖？
如何用 shadcn eject 把 shadcn/tailwind.css 内联进全局样式并移除 shadcn 包依赖【免费下载链接】uiA set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.项目地址: https://gitcode.com/GitHub_Trending/ui/ui如果你的项目通过 shadcn CLI 的init初始化过全局 CSS 文件里会有一行import shadcn/tailwind.css;这意味着项目依赖了shadcn包来提供这部分样式。当你不希望保留这个依赖时shadcn eject命令可以把shadcn/tailwind.css的内容直接内联进全局 CSS 文件并把shadcn依赖从项目中移除。本文基于仓库内的 CLI 文档eject 章节/cli.mdx)和 2026 年 5 月的更新说明2026-05-shadcn-eject.mdx给出完整的操作路径。先弄清 shadcn/tailwind.css 提供了什么了解要内联的内容才能在操作后确认样式没有缺失。shadcn 在同时支持 Radix 和 Base UI 两套组件库时需要一个存放两者共同依赖的 Tailwind 工具类的地方例如data-open:、data-closed:这类自定义 variant 和no-scrollbar这类 utilityRTL 支持开发中遇到的一些 bug 也更适合在这个共享位置统一修复而不是在每个组件里重复。shadcn/tailwind.css就是为这些内容创建的。运行init后它被添加为全局 CSS 中的一行 import。文档说明它的工作方式与tw-animate-css等其他 CSS import 一致一个小的依赖包在生产构建中被 tree-shake并在构建时解析。CLI 文档对它的描述是提供共享的 Tailwind v4 utilities包括自定义 variantdata-open:、data-closed:等和 accordion 动画。运行 eject 前的检查项目已经过init初始化或按手动安装文档配置过样式全局 CSS 文件中存在import shadcn/tailwind.css;这一行。被修改的目标文件是components.json中tailwind.css配置项指向的全局 CSS 文件命令会改写这个文件建议先确认它的内容已提交或可回滚。在 monorepo 中components.json和全局 CSS 文件位于同一个 workspace 内命令需要指向该 workspace。执行内联并移除依赖在项目根目录全局 CSS 所在目录运行npx shadcnlatest eject该命令做两件事把shadcn/tailwind.css内联进全局 CSS 文件并从项目中移除shadcn依赖。monorepo 场景如果components.json和全局 CSS 在某个子 workspace 里用-c指定工作目录从包含这两个文件的 workspace 运行npx shadcnlatest eject -c packages/ui-c packages/ui中的路径按你实际的 workspace 目录替换。完整参数如下来自 CLI 文档Usage: shadcn eject [options] inline shadcn/tailwind.css and remove the shadcn dependency Options: -c, --cwd cwd the working directory. defaults to the current directory. -y, --yes skip confirmation prompt. (default: false) -s, --silent mute output. (default: false) -h, --help display help for command-y用于跳过确认提示-s用于静音输出交互运行时默认会先出现确认提示。验证结果文档给出的 before / after 对比以下为文档示例运行前import tailwindcss; import tw-animate-css; import shadcn/tailwind.css;运行后文档示例import tailwindcss; import tw-animate-css; /* ejected from shadcn4.8.3 */ theme inline { keyframes accordion-down { from { height: 0; } to { height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) ); } } } custom-variant contenteditable="false">【免费下载链接】uiA set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.项目地址: https://gitcode.com/GitHub_Trending/ui/ui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考