Nuxt Tailwind
Tailwind CSS 模块,适用于 Nuxt ⚡️
功能
- 👌 零配置即可开始
- 🪄 包含 CSS 嵌套,使用 postcss-nesting
- 🎨 发现您的 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 类 ✨
您可以在 Nightly 版本 上测试最新的添加内容!
贡献
您可以在线为该模块做出贡献
或在本地
- 克隆此存储库
- 使用
pnpm i
安装依赖项 - 使用
pnpm dev:prepare
为开发做好准备 - 使用
pnpm dev
启动开发服务器
文档
您可以使用 pnpm docs:dev
在本地运行 docs/
,或者运行构建
- 在构建应用程序之前,请确保在
.env
文件中添加您的 Nuxt UI Pro 许可证。 - 使用
pnpm docs:build
运行 SSG 构建 - 使用
pnpm docs:preview
在本地查看生产构建
查看 部署文档 以获取更多信息。
许可证
MIT - 用 💚 制作