https://github.com/atif0075/vite-vue3-typescript-tailwind-starter

A Starter Template of Vue 3.Live Preview at https://vite-starter-temp.netlify.app/
https://github.com/atif0075/vite-vue3-typescript-tailwind-starter

animation animexyz pinia starter tailwindcss typescript vite vue vue3 vuerouter

Last synced: 28 days ago
JSON representation

A Starter Template of Vue 3.Live Preview at https://vite-starter-temp.netlify.app/

• Host: GitHub
• URL: https://github.com/atif0075/vite-vue3-typescript-tailwind-starter
• Owner: atif0075
• Created: 2022-03-26T17:48:11.000Z (almost 3 years ago)
• Default Branch: master
• Last Pushed: 2023-05-06T07:18:06.000Z (over 1 year ago)
• Last Synced: 2024-04-30T09:26:58.142Z (8 months ago)
• Topics: animation, animexyz, pinia, starter, tailwindcss, typescript, vite, vue, vue3, vuerouter
• Language: Vue
• Homepage: https://vite-starter-temp.netlify.app/
• Size: 75.2 KB
• Stars: 14
• Watchers: 1
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Vue 3 + Typescript + Vite + Tailwind + AnimXYZ

This template should help get you started developing with Vue 3 and Typescript in Vite. The template uses Vue 3 `` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

## Features

- ⚡️ [Vue 3](https://github.com/vuejs/vue-next), [Vite 2](https://github.com/vitejs/vite), - Lightning Fast HMR

- 🗂 [File based routing](./src/views)

- 📦 [Components auto importing](./src/components)

- 🎨 [Tailwindcss](https://tailwindcss.com) - A utility-first CSS framework

- 🎨 [AnimXYZ](https://animxyz.com/) - The first composable

  CSS animation toolkit

- 🔥 Use the new `<script setup>` style

- 🦾 TypeScript, of course

## Recommended IDE Setup

- [VSCode](https://code.visualstudio.com/) + [Vue - Official](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)

## Type Support For `.vue` Imports in TS

Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases, this is fine if you don't care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's `.vue` type support plugin by running the `Vue - Official` from VSCode command palette.

## Try it now!

### GitHub Template

[Create a repo from this template on GitHub](https://github.com/atif0075/Vite-Vue3-Typescript-Tailwind-Starter/generate).

### Clone to local

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

```bash

npx degit atif0075/Vite-Vue3-Typescript-Tailwind-Starter

cd Vite-Vue3-Typescript-Tailwind-Starter

yarn

```