Nuxt Tailwind

Tailwind CSS 的 Nuxt 模組 ⚡️

• ✨  發行說明
• ▶️ 線上試玩
• 📖  文件

功能

• 👌  零配置即可開始
• 🪄  包含使用 postcss-nesting 的 CSS Nesting
• 🎨  探索您的 Tailwind 配置和顏色 ( 查看影片 )
• ⚙️  在您的應用程式中 引用您的 Tailwind 配置
• 📦  可透過使用 hooks 的 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 Releases 上測試最新的新增功能！

📖  閱讀更多

貢獻

您可以線上貢獻此模組

或在本機貢獻

1. 複製此儲存庫
2. 使用 pnpm i 安裝依賴項
3. 使用 pnpm dev:prepare 準備開發
4. 使用 pnpm dev 啟動開發伺服器

文件

您可以使用 pnpm docs:dev 在本機執行 docs/，或執行建置

1. 在建置應用程式之前，請務必在 .env 檔案中加入您的 Nuxt UI Pro 授權。
2. 使用 pnpm docs:build 執行 SSG 建置
3. 使用 pnpm docs:preview 在本機檢視生產版本

請查看 部署文件 以取得更多資訊。

授權

MIT - 用 💚 製作