Nuxt Tailwind
为 Nuxt 启用 Tailwind CSS ⚡️
功能
- 👌 零配置即可开始
- 🪄 包含 CSS Nesting 和 postcss-nesting
- 🎨 发现您的 Tailwind 配置和颜色 (查看视频)
- ⚙️ 在您的应用程序中 引用您的 Tailwind 配置
- 📦 可通过 Nuxt 模块 使用 hooks 进行扩展
- 🚀 支持 Nuxt 3 和 Nuxt 2
快速设置
使用 Nuxt CLI 将 @nuxtjs/tailwindcss 添加到您的项目中
npx nuxi@latest module add 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 - 用 💚 制作