Files
license-manager/frontend
2025-09-05 22:28:37 +08:00
..
2025-07-31 11:13:41 +08:00
2025-09-05 09:33:54 +08:00
2025-07-31 11:13:41 +08:00
2025-08-21 15:38:32 +08:00
fix
2025-09-05 22:22:06 +08:00
2025-07-31 20:40:37 +08:00
2025-08-21 15:38:32 +08:00
2025-09-05 09:33:54 +08:00
2025-09-05 09:33:54 +08:00
2025-07-31 11:13:41 +08:00
fix
2025-09-05 22:28:37 +08:00

Vue 3 + TypeScript + Vite Project Template

This project is based on Vue 3, TypeScript, and Vite, integrating mainstream front-end development tools and best practices. It is suitable for quickly building modern web applications.

  • IDE: VS Code
  • Plugins: Volar (recommended to disable Vetur), TypeScript Vue Plugin (Volar)
  • Node Version: Recommended 16+ (tested on 19.0.0)

Project Features

  • Tech Stack: Vue 3 + TypeScript + Vite
  • Routing: Integrated vue-router, supports dynamic routing
  • State Management: Integrated vuex
  • UI Framework: Supports Element Plus
  • Internationalization: Integrated vue-i18n, supports multi-language switching
  • Responsive Adaptation: Based on px and media queries
  • Code Quality: Integrated ESLint, Prettier
  • Build Optimization: gzip compression, bundle analysis, code splitting
  • Clear Directory Structure: src contains assets, components, views, router, store, utils, etc.
  • Environment Variable Management: Supports multi-environment configuration, flexible switching, and packaging for different environments
  • Static Asset Management: Automatically categorizes and bundles assets, adds timestamps to prevent caching
  • Unit Test Support: Can be extended with Jest/Vitest

Directory Structure

├── public/               # Static assets
├── src/
│   ├── assets/           # Images, styles, and other resources
│   ├── components/       # Common components
│   ├── views/            # Page views
│   ├── router/           # Routing configuration
│   ├── store/            # State management
│   ├── utils/            # Utility functions
│   ├── i18n/             # Internationalization configuration
│   ├── App.vue           # Root component
│   └── main.ts           # Entry file
├── .env*                 # Environment variable files
├── vite.config.ts        # Vite configuration
├── tsconfig.json         # TypeScript configuration
├── README.md             # Project documentation

Quick Start

  1. Install dependencies

    npm install
    
  2. Start the development server

    npm run serve
    
  3. Build for production

    npm run prod
    
  4. Build for test environment

    npm run test
    
  5. Preview production build

    npm run preview
    

Internationalization

  • Chinese and English are supported by default, and you can switch languages at the top right of the login page.
  • The i18n configuration files are located in the src/i18n/ directory.

Other Notes

  • You can extend more pages and features as needed.
  • It is recommended to use VS Code for development to enjoy better type hints and code completion.
  • To customize the theme or adapt to more devices, modify src/assets/styles/variables.scss.

Contribution & Feedback

Feel free to submit Issues or PRs to improve features and documentation.


This template is integrated with [Vue 3 + TypeScript + Vite] and mainstream plugins, suitable for enterprise-level projects or personal learning use.