Awesome

<h1 align="center"><a href="https://github.com/ElanYoung/vite-vue-js-starter-template" target="_blank">Vite 5 🚀 - Vue 3 Starter Template</a></h1> <a href="https://nodejs.org/en/about/releases/"> <img src="https://img.shields.io/node/v/vite.svg" alt="node compatility" /> </a> <a href="https://cn.vitejs.dev" rel="nofollow"> <img src="https://img.shields.io/badge/vite-5.0.2-3963bc.svg" alt="vite" style="max-width:100%;" /> </a> <a href="https://github.com/vuejs/vue"> <img src="https://img.shields.io/badge/vue-3.3.9-brightgreen.svg" alt="vue" /> </a> <a href="https://github.com/vuejs/router"> <img src="https://img.shields.io/badge/vue--router-4.2.5-brightgreen.svg" alt="vue-router" /> </a> <a href="https://github.com/vuejs/pinia"> <img src="https://img.shields.io/badge/pinia-2.1.7-brightgreen.svg" alt="pinia" /> </a> <a href="https://doc.starimmortal.com"> <img alt="author" src="https://img.shields.io/badge/author-ElanYoung-blue.svg" /> </a> <a href="https://github.com/ElanYoung/vite-vue-js-starter-template/blob/master/LICENSE"> <img alt="LICENSE" src="https://img.shields.io/github/license/ElanYoung/vite-vue-js-starter-template.svg" /> </a> Vite5 + Vue3 + JavaScript + Vue Router + Pinia + TDesign + Less + Axios + ESLint + Stylelint + Prettier <a href="https://elanyoung.github.io/vite-vue-js-starter-template">Live Demo</a> English | <a href="./README.zh-CN.md">简体中文</a>

Features

⚡️ Vite 5 - born with fastness
🖖 Vue 3 - Composition API and <script setup>
🚦 Vue Router - The official router for Vue.js.
📦 Pinia - Intuitive, type safe and flexible Store for Vue
💻 TDesign - Vue Next for Web
🎨 Less - It's CSS, with just a little more
📥 APIs auto importing - Use Composition API and others directly
😃 Icons auto install - Access thousands of icons as components on-demand universally.
🔗 Axios - Promise based HTTP client for the browser and node.js
🧰 Husky + Lint-Staged - Git Hook Tools
🛡️ EditorConfig + ESLint + Prettier + Stylelint - Code Standards
🔨 Commitizen + Commitlint - Submit Standards

Coding Style

Use Composition API with <script setup> SFC syntax
ESLint
Prettier
Stylelint

Development Tools

pnpm - fast, disk space efficient package manager
Visual Stuido Code Extensions
- Vite - Fire up Vite server automatically
- Volar - Vue 3 <script setup> IDE support
- EditorConfig for VS Code - A solution for unifying code formats
- ESLint - Find and fix problems in your JavaScript code
- Prettier - An opinionated code formatter
- StyleLint - A mighty, modern linter that helps you avoid errors and enforce conventions in your styles.

Try it now!

Vite5 Vue3 JavaScript Starter Template requires Node >= 18.00

GitHub Template

Create a repo from this template on GitHub.

Clone to local

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

# [optional] if you are using Windows, you need to close the end-of-line conversion
git config --global core.autocrlf input

# clone repository
git clone https://github.com/ElanYoung/vite-vue-js-starter-template

# open folder vite-vue-js-starter-template
cd vite-vue-js-starter-template

# install packages
npm i

Checklist

When you use this template, try follow the checklist to update your info properly

Change the author name in LICENSE
Change the title in App.vue
Change the hostname in vite.config.js
Change the favicon in public
Remove the .github folder which contains the funding info
Clean up the READMEs and remove routes

Usage

Development

Just run and visit http://localhost:3000

## install dependencies
npm install

## set up
npm run dev

Build

## build
npm run build

Achievement

🎉 Added to the Awesome Vite.Js

License

MIT