mirror of
https://github.com/XiaoDaiGua-Ray/ray-template.git
synced 2025-04-05 07:03:00 +08:00
155 lines
7.5 KiB
Markdown
155 lines
7.5 KiB
Markdown
<div align="center">
|
||
<a href="https://github.com/XiaoDaiGua-Ray/ray-template">
|
||
<img
|
||
alt="Ray Template"
|
||
width="200"
|
||
height="200"
|
||
src="https://avatars.githubusercontent.com/u/51957438?v=4"
|
||
/>
|
||
</a>
|
||
<br />
|
||
<br />
|
||
<a href="https://nodejs.org/en/about/previous-releases"><img src="https://img.shields.io/node/v/vite.svg" alt="node compatibility"></a>
|
||
<a href="https://github.com/XiaoDaiGua-Ray/ray-template/blob/main/LICENSE"
|
||
><img
|
||
src="https://img.shields.io/github/license/XiaoDaiGua-Ray/ray-template"
|
||
alt="LICENSE"
|
||
/></a>
|
||
<a href="#badge"><img src="https://img.shields.io/github/languages/top/XiaoDaiGua-Ray/ray-template" alt="language"></a>
|
||
<a href="https://www.npmjs.com/package/ray-template"><img src="https://img.shields.io/npm/v/ray-template" alt="npm package"></a>
|
||
</div>
|
||
|
||
<div align="center">
|
||
|
||
# Ray Template
|
||
|
||
简体中文 | [English](https://github.com/XiaoDaiGua-Ray/ray-template/blob/main/README.md)
|
||
|
||
一个 `完全免费`、`高效`、`特性完整` 并且基于 vite5.x & ts(x) & pinia & vue3.x 等最新技术的中后台模板。
|
||
|
||
</div>
|
||
|
||
## 🌻 简介
|
||
|
||
`Ray Template`采用前沿前端技术，摒弃繁杂与臃肿，采用模块化设计，解耦数据、方法和视图，专注业务开发。提供丰富配置和丰富的模板 `Hooks`，支持个性化定制，满足你的项目需求。
|
||
|
||
## ✨ 特性
|
||
|
||
- `全新技术栈：`使用 ts(x), vite5.x, vue3.x, pinia 等前端前沿技术开发
|
||
- `主题：`可配置的主题
|
||
- `国际化：`内置完善的国际化方案
|
||
- `权限：`内置完善的动态路由权限生成方案
|
||
- `组件：`二次封装了多个常用的组件
|
||
- `工具包：`常用的工具函数封装
|
||
- `缓存：`任意深度页面缓存
|
||
- `模块化设计：`解耦管理的数据、方法、视图，放心二次开发
|
||
- `配置化：`支持丰富的配置项
|
||
- `代码风格：`内置 prettier, eslint 等代码风格工具
|
||
- `多端适配：`支持 pc, phone, pad
|
||
- `文档：`完善的文档
|
||
- `Mock 数据：`内置 Mock 数据方案
|
||
- `Axios 请求：`采用插件式设计二次封装 axios 库拦截器，让拦截器更加灵活
|
||
- `SVG：`内置 svg icon 解决方案
|
||
- `Hooks：`基于模板特性封装的 hooks 让你更加方便的使用模板一些功能
|
||
- `TypeScript：`提供完整的类型
|
||
- `Vitest：`内置 vitest 测试方案
|
||
|
||
## 👀 预览地址
|
||
|
||
- [点击预览](https://xiaodaigua-ray.github.io/ray-template/#/)
|
||
|
||
## 📌 文档地址
|
||
|
||
- [文档](https://xiaodaigua-ray.github.io/ray-template-doc/)
|
||
|
||
## 🔋 更新日志
|
||
|
||
- [更新日志](https://github.com/XiaoDaiGua-Ray/xiaodaigua-ray.github.io/blob/main/CHANGELOG.md)
|
||
|
||
## 🪴 准备
|
||
|
||
- [Node](http://nodejs.org/) 和 [git](https://git-scm.com/) - 项目开发环境
|
||
- [Vite](https://vitejs.dev/) - 熟悉 vite 特性
|
||
- [Vue3](https://v3.vuejs.org/) - 熟悉 Vue 基础语法
|
||
- [TypeScript](https://www.typescriptlang.org/) - 熟悉 TypeScript 基本语法
|
||
- [ES6+](http://es6.ruanyifeng.com/) - 熟悉 es6 基本语法
|
||
- [Vue-Hooks-Plus](https://inhiblabcore.github.io/docs/hooks/) - 熟悉 vue-hooks-plus useRequest 方法的基本使用
|
||
- [Vue-Router-Next](https://next.router.vuejs.org/) - 熟悉 vue-router4.x 基本使用
|
||
- [Naive-UI](https://www.naiveui.com) - naive ui 基本使用
|
||
- [Mock.js](https://github.com/nuysoft/Mock) - mockjs 基本语法
|
||
- [Pinia](https://pinia.vuejs.org/zh/introduction.html) - 状态管理器 pinia 使用
|
||
- [TSX](https://github.com/vuejs/babel-plugin-jsx/blob/main/packages/babel-plugin-jsx/README-zh_CN.md) - tsx 基本语法
|
||
- [Vitest](https://cn.vitest.dev/guide/) - vitest 基本使用
|
||
|
||
## 📦 起步
|
||
|
||
### 获取项目
|
||
|
||
```sh
|
||
# github
|
||
git clone https://github.com/XiaoDaiGua-Ray/ray-template.git
|
||
```
|
||
|
||
### 拉取依赖
|
||
|
||
```sh
|
||
pnpm i
|
||
```
|
||
|
||
### 测试项目
|
||
|
||
```sh
|
||
|
||
pnpm test
|
||
```
|
||
|
||
### 启动项目
|
||
|
||
```sh
|
||
pnpm dev
|
||
```
|
||
|
||
### 项目打包
|
||
|
||
```sh
|
||
pnpm build
|
||
```
|
||
|
||
### 预览项目
|
||
|
||
```sh
|
||
pnpm preview
|
||
```
|
||
|
||
### 体积分析
|
||
|
||
```sh
|
||
pnpm report
|
||
```
|
||
|
||
### 快速开发
|
||
|
||
只需要删除 `views/demo`, `router/modules/demo` 下的文件即可得到一个干净的项目模板。
|
||
|
||
## 🪴 项目活动
|
||
|
||
|
||
|
||
### 贡献者
|
||
|
||
感谢他们的所做的一切贡献 🐝 ！
|
||
|
||
<a href="https://github.com/XiaoDaiGua-Ray/ray-template/graphs/contributors">
|
||
<img src="https://contrib.rocks/image?repo=XiaoDaiGua-Ray/ray-template" />
|
||
</a>
|
||
|
||
## 浏览器支持
|
||
|
||
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
|
||
| :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
|
||
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
|
||
|
||
## 📄 证书
|
||
|
||
[MIT License](https://github.com/XiaoDaiGua-Ray/ray-template/blob/main/LICENSE) © 2022-PRESENT [Ray](https://github.com/XiaoDaiGua-Ray)
|