# PC端之Vite+Ts框架

**Repository Path**: trident-framework/pc-vite-ts

## Basic Information

- **Project Name**: PC端之Vite+Ts框架
- **Description**: PC端之Vite+Ts框架【Vue3、Vite、Ts、Pinia、Pinia-plugin-persistedstate、Element-plus、Sass、Axios、Nprogress、Vue-cropper】
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2024-10-23
- **Last Updated**: 2025-09-30

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# PC端之Vite+Ts框架

#### 介绍
PC端之Vite+Ts框架是一个基于Vite构建工具和TypeScript语言的前端开发框架，适用于PC端应用开发。该框架集成了多种常用库和工具，提供了完整的开发解决方案。

#### 软件架构
该框架基于Vite+Ts构建，使用Vue 3框架进行开发，集成了Element Plus组件库、Pinia状态管理、Vue Router路由管理等。项目结构清晰，包含常用的业务组件、工具类、API接口定义、类型定义等模块。

#### 安装教程

1. 安装项目依赖：
   ```bash
   npm install
   ```

2. 安装项目所需依赖包：
   ```bash
   npm i axios -S
   npm i element-plus --save
   npm i nprogress
   npm i underscore
   npm i @types/underscore
   npm i pinia-plugin-persistedstate
   npm i pinia
   npm i sass
   npm i vue-router@4
   npm i vite-plugin-svg-icons -D
   npm i fast-glob -D
   npm i vue-cropper@next
   npm i @types/node
   ```

#### 使用说明
1. 项目入口文件为 `src/main.ts`，在此文件中创建Vue实例并挂载相关插件。
2. 路由配置在 `src/router/index.ts` 中。
3. 状态管理使用Pinia，配置在 `src/stores/index.ts` 及其模块文件中。
4. API请求封装在 `src/apis` 目录下。
5. 组件库使用Element Plus，同时包含自定义组件在 `src/components` 目录下。
6. 样式文件使用SCSS进行管理，基础样式定义在 `src/styles` 目录下。
7. 工具类方法定义在 `src/utils` 目录下，如HTTP请求封装、本地存储、时间处理等。

#### 参与贡献
1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request

#### 特技
1. 使用 Readme_XXX.md 来支持不同的语言，例如 Readme_en.md, Readme_zh.md
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)