# vue3-admin

**Repository Path**: ziajun/vue3-admin

## Basic Information

- **Project Name**: vue3-admin
- **Description**: 基于vue-cli + vue3.x + vue-router4.x + vuex4.x + aixos + element plus + iconfont 的基础后台管理系统模板
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: dev
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 0
- **Created**: 2021-01-17
- **Last Updated**: 2022-09-09

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# vue3-admin

## 简介

vue3-admin后台管理是一个后台前端，它基于 [vue3.x](https://v3.cn.vuejs.org/) 和 [element-plus](https://element-plus.gitee.io/#/zh-CN)实现。它使用了最新的前端技术栈，简单2.0版本，提供了丰富的功能组件

## 前序准备

你需要在本地安装 [node](http://nodejs.org/) 和 [git](https://git-scm.com/)。本项目技术栈基于 [ES2015+](http://es6.ruanyifeng.com/)、[vue3.x](https://v3.cn.vuejs.org/)、[vuex4.x](https://next.vuex.vuejs.org/)、[vue-router4.x](https://next.router.vuejs.org/) 、[vue-cli4.x](https://cli.vuejs.org/) 、[axios](https://github.com/axios/axios) 和 [element-plus](https://element-plus.gitee.io/#/zh-CN)，提前了解和学习这些知识会对使用本项目有很大的帮助。

[项目图片预览](http://admin.gdiic.com/admin/profile/upload/2021/04/29/d0288dbd-fd96-4c17-bfd4-88596c5e9fef.png)

[项目图片预览](http://admin.gdiic.com/admin/profile/upload/2021/04/30/d5db992c-8def-43fc-a5d9-ec547e9b3d8d.png)

## Sponsors

## 目录结构

``` 
├── public                     # 静态资源
│   │── favicon.ico            # favicon图标
│   └── index.html             # html模板
├── src                        # 源代码
│   ├── components             # 公用组件
│   ├── assets                 # 静态资源（icon图标，样式）
│   ├── store                  # store管理
│   ├── router                 # 路由相关
│   ├── utils                  # 公用方法
│   ├── views                  # views 页面
│   ├── App.vue                # 入口页面
│   ├── main.js                # 入口文件 加载组件 初始化等
│   ├── settings.js            # 配置文件
│   └── permission.js          # 权限管理
├── vue.config.js              # vue-cli 配置
├── postcss.config.js          # postcss 配置
└── package.json               # package.json
```



## 功能

```
- 登录 / 注销

- 全局功能
  - 动态面包屑
  - 快捷导航(标签页)
  - Svg Sprite 图标
  - Screenfull全屏
  - 自适应收缩侧边栏

- 错误页面
  - 404

- 综合实例
```

## 开发

```bash
# 安装依赖
npm install

# 淘宝镜像
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run serve

浏览器访问 http://localhost:9508
```

## 构建

```bash
# 构建开发环境
npm run build:stage

# 构建生产环境
npm run build:prod

```