# arco-admin-template

**Repository Path**: b9348/arco-admin-template

## Basic Information

- **Project Name**: arco-admin-template
- **Description**: 🔥基于 vite构建的react后台模版 使用： acro-design + react-router-dom v6 + mockjs + less，支持国际化，亮色暗色切换等
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://hu-snail.gitee.io/arco-admin-template/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 11
- **Created**: 2023-12-13
- **Last Updated**: 2023-12-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<div align="center"><img height="120px" src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/logo/logo.svg"/></div>

<h1 align="center">Arco admin template</h1>

## 简介

`Arco-admin-template`是一个免费开源的中后台模板你，使用了`React17`、`vite2`、`react-router-dom v6`、`less` 等主流技术开发，开箱即用的中后台前端解决方案。

项目目的：

- 学习`React Hook`相关 Api
- 掌握`Vite2`插件机制、构建配置
- 学习 `Ract-router-dom v6`新特性

## 特性

- 技术栈：React17/React-router-dom v6/vite2
- Javascript 版本
- 可自定义主题
- 国际化方案
- Mock 数据方案
- 暗夜模式
- Arco Design UI 库

## 文档

正在编写中......

## 准备

- `Node`: 版本建议 >= 12.0.0 [下载链接](https://nodejs.org/zh-cn/download/)
- `Git`: [版本管理工具](https://www.git-scm.com/download)
- `Visual Studio Code`: [最新版本](https://code.visualstudio.com/Download/)
  - [Eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)- 脚本代码检查
  - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - 代码格式化
  - [Stylelin](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) - css 格式化

## 安装使用

- 获取代码

```sh
git clone https://github.com/hu-snail/arco-admin-template.git
```

- 安装依赖

```sh
yarn install
```

- 运行

```sh
yarn dev
```

- 打包

```sh
yarn build
```

- 本地预览

```sh
yarn preview
```

## 预览截图
- 登录页
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/login.png"/>

- 仪表盘
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/work.png"/>

- 资源
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/res.png"/>

- 按钮组件
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/comp-btn.png"/>

- 设置
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/setting.png"/>

- 404
<img src="https://gitee.com/hu-snail/arco-admin-template/raw/master/src/assets/screenshot/500.png"/>

## 浏览器支持

本地开发推荐使用`Chrome 80+` 浏览器

支持现代浏览器, 不支持 IE

## 维护者

[@hu-snail](https://github.com/hu-snail/)

## 捐赠

如果你觉得这个项目对你有帮助，你可以帮作者买一杯咖啡表示支持!

<div style="display: flex; justify-content: space-between;"><img  width="48%" src="https://gitee.com/hu-snail/vue3-admin-element-template/raw/master/src/assets/zfb.jpeg"/></div>

## License

[MIT © hu-snail-2021](https://github.com/hu-snail/arco-admin-template/blob/master/LICENSE)