Tailwindcss
Tailwind CSS module for Nuxt
Nuxt Tailwind
Enable Tailwind CSS for Nuxt ⚡️
📖 Documentation | ▶️ Play online | ✨ Release Notes
Features
- 👌 Zero configuration to start
- 🪄 Includes CSS Nesting with postcss-nesting
- 🎨 Discover your Tailwind Config & Colors (see video)
- ⚙️ Reference your Tailwind config in your app
- 📦 Extendable by Nuxt modules using hooks
- 🚀 Supports both Nuxt 3 and Nuxt 2
Quick Setup
Add @nuxtjs/tailwindcss using the Nuxt CLI to your project
npx nuxi@latest module add tailwindcss
..or install using your dependency manager
# Using pnpm
pnpm add --save-dev @nuxtjs/tailwindcss
# Using yarn
yarn add --dev @nuxtjs/tailwindcss
# Using npm
npm install --save-dev @nuxtjs/tailwindcss
and then to the modules section of nuxt.config.{ts,js}
export default defineNuxtConfig({
modules: [
'@nuxtjs/tailwindcss'
]
})
That's it! You can now use Tailwind classes in your Nuxt app ✨
Contributing
You can contribute to this module online:
..or locally
- Clone this repository
- Install dependencies using
pnpm i - Prepare for development using
pnpm dev:prepare - Start development server using
pnpm dev
Docs
You can run docs/ locally by using pnpm docs:dev, or to run a build:
- Make sure to add your Nuxt UI Pro license in the
.envfile before building the application. - Run SSG build using
pnpm docs:build - Review the production build locally using
pnpm docs:preview
Check out the deployment documentation for more information.
License
MIT - Made with 💚
