https://github.com/initred/nuxt3-tailwindcss3-starter-kit

The template that starts tailwindcss fastest on nuxt3 without annoying settings
https://github.com/initred/nuxt3-tailwindcss3-starter-kit

eslint headlessui heroicons nuxt nuxt3 nuxtjs starter-template tailwind tailwind-css tailwindcss tailwindcss3 vite vitest vue vue-composition-api vue3

Last synced: 15 days ago
JSON representation

The template that starts tailwindcss fastest on nuxt3 without annoying settings

• Host: GitHub
• URL: https://github.com/initred/nuxt3-tailwindcss3-starter-kit
• Owner: initred
• Created: 2021-12-14T08:18:51.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2024-07-01T14:18:13.000Z (7 months ago)
• Last Synced: 2024-12-28T15:11:43.202Z (24 days ago)
• Topics: eslint, headlessui, heroicons, nuxt, nuxt3, nuxtjs, starter-template, tailwind, tailwind-css, tailwindcss, tailwindcss3, vite, vitest, vue, vue-composition-api, vue3
• Language: Vue
• Homepage: https://nuxt3-tailwindcss3-starter-kit.netlify.app/
• Size: 2.92 MB
• Stars: 157
• Watchers: 3
• Forks: 18
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


    Nuxt 3 With Tailwindcss 3




🔥 If We need anything, I will add it.





The template that starts tailwindcss fastest on nuxt3 without annoying settings



## Features

- 💚 [Nuxt 3](https://v3.nuxtjs.org) - SSR, ESR, File-based routing, components auto importing, modules, etc.

- ⚡️ [Vite](https://vitejs.dev/) - Instant HMR

- 🎨 [Tailwindcss](https://tailwindcss.com/) - A utility-first CSS framework for rapidly building custom user interfaces.

- ⚒️ [HeadlessUI](https://headlessui.dev/) - A set of completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

- 🔥 The `` syntax

- 🍍 [State Management via Pinia](https://pinia.esm.dev/)

- 📥 APIs auto importing - For Composition API, VueUse and custom composables.

- 🏎 Zero-config cloud functions and deploy

- 🦾 [TypeScript](https://www.typescriptlang.org/), of course

### Nuxt Modules

- [VueUse](https://github.com/vueuse/vueuse) - collection of useful composition APIs

- [ColorMode](https://github.com/nuxt-community/color-mode-module) - dark and Light mode with auto detection made easy with Nuxt.

- [Pinia](https://pinia.esm.dev/) - intuitive, type safe, light and flexible Store for Vue.

- [NuxtIcon](https://github.com/nuxt-modules/icon) - Icon module for Nuxt with 100,000+ ready to use icons from [Iconify](https://iconify.design/).

- [NuxtHeadlessUI](https://github.com/P4sca1/nuxt-headlessui) - Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

- [NuxtVitest](https://github.com/danielroe/nuxt-vitest) - A vitest environment for testing code that needs a Nuxt runtime environment

- [NuxtDevtools](https://github.com/nuxt/devtools) - Nuxt DevTools is a set of visual tools that help you to know your app better.

## IDE

- [Visual Studio Code](https://code.visualstudio.com/)

- [Volar](https://github.com/johnsoncodehk/volar)

- [Tailwindcss-Intellisense](https://github.com/tailwindlabs/tailwindcss-intellisense)

- [Iconify IntelliSense](https://github.com/antfu/vscode-iconify)

- [VSCode Goto Alias](https://github.com/antfu/vscode-goto-alias)

## Try it now!

### GitHub Template

[Create a repo from this template on GitHub](https://github.com/initred/nuxt3-tailwindcss3-starter-kit/generate).

### Clone to local

If you prefer to do it manually with the cleaner git history

```bash

npx degit initred/nuxt3-tailwindcss3-starter-kit my-nuxt3-app

cd my-nuxt3-app

pnpm i # If you don't have pnpm installed, run: npm install -g pnpm

```