ElanYoung / vite-vue-js-starter-template

🚀 Vite5 + Vue3 + JavaScript Starter Template

Vite 5 🚀 - Vue 3 Starter Template

Vite5 + Vue3 + JavaScript + Vue Router + Pinia + TDesign + Less + Axios + ESLint + Stylelint + Prettier

Live Demo

English | 简体中文

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

Copyright (c) 2022 ElanYoung