@nuxtjs/tailwindcss
@nuxtjs/tailwindcss
在您的 Nuxt 应用程序中,只需几秒钟即可添加 Tailwind CSS,并包含 PurgeCSS 以实现最小化的 CSS。
Nuxt Tailwind
Tailwind CSS 为 Nuxt 提供的模块 ⚡️
功能特性
- 👌 零配置即可开始
- 🪄 包括带有 postcss-nesting 的 CSS 嵌套
- 🎨 发现您的 Tailwind 配置 & 颜色 (查看视频)
- ⚙️ 在您的应用程序中引用您的 Tailwind 配置
- 📦 可以使用 钩子通过 Nuxt 模块进行扩展
- 🚀 支持 Nuxt 3 和 Nuxt 2
快速设置
使用 Nuxt CLI 将 @nuxtjs/tailwindcss
添加到您的项目中
npx nuxi@latest module add tailwindcss
或者使用您的依赖管理器添加 @nuxtjs/tailwindcss
# Using pnpm
pnpm add --save-dev @nuxtjs/tailwindcss
# Using yarn
yarn add --dev @nuxtjs/tailwindcss
# Using npm
npm install --save-dev @nuxtjs/tailwindcss
然后添加到 nuxt.config.{ts,js}
的 modules
部分
export default defineNuxtConfig({
modules: [
'@nuxtjs/tailwindcss'
]
})
就是这样!您现在可以在您的 Nuxt 应用程序中使用 Tailwind 类了✨
您可以在每夜构建版本上测试最新的添加!
贡献
您可以在线为此模块做出贡献
或者在本地
- 克隆此存储库
- 使用
pnpm i
安装依赖项 - 使用
pnpm dev:prepare
准备进行开发 - 使用
pnpm dev
启动开发服务器
文档
您可以使用 pnpm docs:dev
在本地运行 docs/
,或者运行构建
- 在构建应用程序之前,请确保在
.env
文件中添加您的 Nuxt UI Pro 许可证。 - 使用
pnpm docs:build
运行 SSG 构建 - 使用
pnpm docs:preview
在本地查看生产版本
查看部署文档以获取更多信息。
许可证
MIT - 用 💚 制成