Nuxt Tailwind
為 Nuxt 啟用 Tailwind CSS ⚡️
功能
- 👌 零配置即可開始
- 🪄 包含帶 postcss-nesting 的 CSS 巢狀
- 🎨 發現您的 Tailwind 配置和顏色 (檢視影片)
- ⚙️ 在您的應用程式中引用您的 Tailwind 配置
- 📦 可透過使用 hooks 的 Nuxt 模組進行擴充套件
- 🚀 支援 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/，或執行構建
- 在構建應用程式之前，請務必將您的 Nuxt UI Pro 許可證新增到
.env檔案中。 - 使用
pnpm docs:build執行 SSG 構建 - 使用
pnpm docs:preview在本地檢視生產構建
有關更多資訊，請檢視部署文件。
許可證
MIT - 用 💚 製作