# vue3-basic-template

**Repository Path**: rlyan2022/vue3-basic-template

## Basic Information

- **Project Name**: vue3-basic-template
- **Description**: vue3-basic-template 是一款开源开箱即用的中后台管理系统。基于 Vue3、Vite、Element-Plus、TypeScript、Pinia 等主流技术开发，内置许多开箱即用的组件，能快速构建中后台管理系统，目前决定完全开源。
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: main
- **Homepage**: https://gist006.gitee.io/vue3-basic-template/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2024-06-29
- **Last Updated**: 2024-10-06

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<h1 align="center">vue3-basic-template</h1>

## 简介

`vue3-basic-template` 是一款开源开箱即用的中后台管理系统。基于 `Vue3`、`Vite`、`Element-Plus`、`TypeScript`、`Pinia` 等主流技术开发，内置许多开箱即用的组件，能快速构建中后台管理系统，目前决定完全开源，如果觉得该项目对你有所帮助，可以点一个 star,如果有一定的经济能力，可以请作者喝一杯咖啡，开源不易！

## 测试账号

```

1.  用户名：admin  密码 任意  拥有admin的权限可以查看所有页面
2.  用户名：test   密码 任意  拥有test的页面权限，可以查看部分页面
3.  用户名：editor 密码 任意  拥有editor的页面权限，可以查看富文本等页面

```

pro版本，地址：[vue3-basic-admin](https://gitee.com/rlyan2022/vue3-basic-template)

## 架构清单

-   Vue3
-   Vue-router
-   Pinia
-   Typescript
-   Vite
-   Axios
-   模拟接口：mockjs
-   代码检测和格式化：eslint+prettier
-   git 提交格式化：husky+lint-staged
-   代码日志规范：@commitlint/cli+@commitlint/config-conventional
-   ...其他

## 功能

-   Axios 集成
    如果对该模块不太懂，可以看： [vue3 之 axios 封装集成](https://juejin.cn/post/7203601905938579517)

```
- loading
- 错误重试机制
- 取消重复请求
```

### 文件目录说明

```
├── build                            ---vite打包配置
├── mock                             ---mock模拟数据
├── public                           ---静态资源文件
├── src
│  ├── api                           ---接口
│  ├── assets                        ---图片
│  ├── components                    ---可复用的vue组件
│  ├── constant                      ---常量
│  ├── directive
│  ├── enums
│  ├── hooks
│  ├── icons
│  ├── layouts                       ---布局方式
│  ├── plugins
│  ├── router                        ---路由
│  ├── store                         ---vuex
│  ├── styles                        ---sass样式
│  ├── utils                         ---方法函数
│  ├── views                         ---页面
│  ├── App.vue
│  ├── main.ts
├── types
├── .env
├── .env.development
├── .env.production
├── .eslintrc.js
├── .prettierrc.cjs
├── commitlint.config.cjs           ---代码提交日志规范
├──  package.json
├──  package-lock.json
├──  README.md
└──  vite.config.ts                 ---vite的配置


```

## 文档

目前尚未搭建文档，如后期有需要可构建

## 安装

```
# 克隆项目
git clone https://github.com/biubiubiu01/vue3-basic-template.git
# 进入项目目录
cd vue3-basic-admin
# 安装依赖
pnpm install
# 本地开发 启动项目
pnpm start
```

### 部署

```
# 打包项目
npm run build

# 预览
npm run preview
```