# Ray Template 简体中文 | [English](https://github.com/XiaoDaiGua-Ray/ray-template/blob/main/README.md) 一个 `完全免费`、`高效`、`特性完整` 并且基于 vite5.x & ts(x) & pinia & vue3.x 等最新技术的中后台模板。

## 🌻 简介 `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` 下的文件即可得到一个干净的项目模板。 ## 🪴 项目活动 ![Alt](https://repobeats.axiom.co/api/embed/fab6071297ab281913a42f07a2779b488cfd62b8.svg 'Repobeats analytics image') ### 贡献者感谢他们的所做的一切贡献 🐝 ！

## 浏览器支持 | [

](http://godban.github.io/browsers-support-badges/)
IE | [

](http://godban.github.io/browsers-support-badges/)
Edge | [

](http://godban.github.io/browsers-support-badges/)
Firefox | [

](http://godban.github.io/browsers-support-badges/)
Chrome | [

](http://godban.github.io/browsers-support-badges/)
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)