Skip to content

Introduction

Vite TS Starter (hereafter referred to as VTS) is a fast development template based on Vite 6.x + Vue 3.x + TypeScript, specifically designed for small and medium-sized B-end background management systems. It integrates technologies such as Element Plus, Vue Router, and Vuex, providing an out-of-the-box frontend solution.

🔥 Online Demo

⭐⭐⭐⭐⭐

If VTS brings convenience to your development work, feel free to give me a ⭐ Star on Github to show your support, it would be the greatest encouragement. The project is continuously being optimized, and your valuable suggestions are welcome to make it even better.

Technology Stack

Click to expand

Features

  • 🚀 Fast Development: Vite6 ultra-fast cold start and HMR significantly improve development efficiency.
  • 🎨 Efficient UI Component Library: Built-in Element Plus 2.x, suitable for background management systems.
  • 📦 Best Practices: Vue 3 Composition API + Vuex 4 + i18n + Permission Management, ready to use.
  • 🔧 Developer-Friendly: TypeScript, ESLint, Stylelint, Husky + lint-staged to ensure code standards.
  • 🌍 Multi-Language Support: Built-in i18n, supports Vue Router-level language switching.
  • 🛠️ Modern Toolchain: Vitest testing framework for faster test execution.
  • 🔄 Flexible Encapsulation: Axios request encapsulation + Vuex Actions to increase code reusability.
  • Enhanced Features: $ModalDialog plugin + <IconFont /> component to simplify development.
  • 🔑 Route Authentication: Built-in route authentication + Nprogress progress bar for easy access control.
  • 📂 Modular Architecture: Modular design for pages, routes, and styles to reduce coupling.
  • Focus on Business Development: Lightweight template, minimal configuration, ready to use.

Use Cases

  • Rapid Construction: Quickly start a Vue 3 + TypeScript background management system and enjoy the efficient development experience brought by Vite.
  • Cutting-Edge Learning: Suitable for developers who wish to master the latest Vite tech stack, Vue Composition API, and best practices.
  • Lightweight Template: Supports developers seeking a feature-rich yet lightweight frontend template.

Template Advantages

  • Ready to Use: Streamlined design with no redundant components and plugins. After cloning, only minimal configuration is needed to get started, avoiding the cumbersome cleanup work required by other templates.
  • Modular Architecture: High cohesion and low coupling modular design, with independent yet collaborative functionality, making it easier to maintain and extend.

In addition to VTS, I also maintain several templates with different technology stacks, hoping they will be helpful to you:

Feel free to choose the template that best fits your development needs!

🌹 Support

If you find this project helpful, or if you like the work I've done, feel free to click the ⭐️ Star button at the top right of the project page to show your support! Every star is the greatest encouragement to me and helps me keep improving and moving forward. I really appreciate your support! 😊

If you have any suggestions, comments, or want to participate in the development of the project, feel free to get in touch with me!

You can interact with us in the following ways:

  • Submit an Issue - If you encounter problems or have ideas for improvements, feel free to submit feedback in the Issues.
  • Contribute Code - If you're interested in contributing code, please refer to the Contributing Guide, and let's work together to make the project better!

Thank you again for your support, and let's make this project stronger together! 🙏