## 简介

一个清新优雅、高颜值且功能强大的后台管理模板，基于最新的前端技术栈，包括 Vue3, Vite7, TypeScript, Pinia 和 UnoCSS。它内置了丰富的主题配置和组件，代码规范严谨，实现了自动化的文件路由系统.

## 特性

- **前沿技术应用**：采用 Vue3, Vite7, TypeScript, Pinia 和 UnoCSS 等最新流行的技术栈。
- **清晰的项目架构**：采用 pnpm monorepo 架构，结构清晰，优雅易懂。
- **严格的代码规范**：遵循 prettier 和 simple-git-hooks，保证代码的规范性。
- **TypeScript**： 支持严格的类型检查，提高代码的可维护性。
- **丰富的主题配置**：内置多样的主题配置，与 UnoCSS 完美结合。
- **内置国际化方案**：轻松实现多语言支持。
- **自动化文件路由系统**：自动生成路由导入、声明和类型。更多细节请查看 [Elegant Router](https://github.com/reader-star/elegant-router)。
- **灵活的权限路由**：同时支持前端静态路由和后端动态路由。
- **丰富的页面组件**：内置多样页面和组件，包括403、404、500页面，以及布局组件、标签组件、主题配置组件等。
- **命令行工具**：内置高效的命令行工具，git提交、删除文件、发布等。
- **移动端适配**：完美支持移动端，实现自适应布局。

## 使用

**环境准备**

确保你的环境满足以下要求：

- **git**: 你需要git来克隆和管理项目版本。
- **NodeJS**: >=20.19.0，推荐 20.19.0 或更高。
- **pnpm**: >= 10.5.0，推荐 10.5.0 或更高。

**克隆项目**

```bash
# github
git clone http://8.137.159.94:3000/ranjl/reader-star.git
```

**安装依赖**

```bash
pnpm i
```

> 由于本项目采用了 pnpm monorepo 的管理方式，因此请不要使用 npm 或 yarn 来安装依赖。

**启动项目**

```bash
pnpm dev
```

**构建项目**

```bash
pnpm build
```

## Git 提交规范

本项目已内置 `commit` 命令，您可以通过执行 `pnpm commit` 来生成符合 [Conventional Commits](<[conventionalcommits](https://www.conventionalcommits.org/)>) 规范的提交信息。在提交PR时，请务必使用 `commit` 命令来创建提交信息，以确保信息的规范性。

## 项目层级

- `apps/admin`: 后台管理
- `apps/user`: 用户端
- `packages/eslint-config`: eslint 配置
- `packages/shared`: 公共组件

## 目录说明

```
read-star
├── .vscode                      // VSCode/Windsurf 项目级配置
│   ├── extensions.json          // 推荐安装的插件
│   ├── launch.json              // 调试配置文件 (Debug Vue/TS)
│   ├── settings.json            // 项目专属设置 (ESLint 校验、格式化规则)
│   └── vue3.code-snippets       // Vue3 代码片段
├── apps                         // 业务应用目录
│   ├── admin                    // 管理端应用 (原 soybean-admin 业务主体)
│   │   ├── build                // Vite 构建相关配置和插件
│   │   ├── src                  // 源代码
│   │   │   ├── assets           // 静态资源 (图片、svg图标)
│   │   │   ├── components       // 全局组件
│   │   │   ├── constants        // 常量 (正则、业务常量)
│   │   │   ├── hooks            // 组合式函数 hooks
│   │   │   ├── layouts          // 布局组件
│   │   │   ├── locales          // 国际化配置
│   │   │   ├── router           // 路由配置 (含 elegant-router 生成文件)
│   │   │   ├── service          // 网络请求接口
│   │   │   ├── store            // Pinia 状态管理
│   │   │   ├── theme            // 主题配置
│   │   │   ├── typings          // TS 类型声明 (*.d.ts)
│   │   │   ├── views            // 页面视图
│   │   │   ├── App.vue          // 根组件
│   │   │   └── main.ts          // 入口文件
│   │   ├── .env                 // 环境配置
│   │   ├── index.html           // 入口 HTML
│   │   ├── package.json         // 应用依赖描述
│   │   └── vite.config.ts       // Vite 配置文件
│   └── user                     // 用户端应用 (镜像拆分后的第二个端)
│       └── ...                  // 结构与 admin 一致
├── packages                     // 公共共享包 (内部依赖库)
│   ├── alova                    // Alova 请求封装
│   ├── axios                    // Axios 请求封装
│   ├── color                    // 颜色处理工具
│   ├── eslint-config            // 自定义本地 ESLint 规范包 (私有化配置)
│   ├── hooks                    // 跨应用复用的组合式 hooks
│   ├── materials                // 组件物料库
│   ├── shared                   // 共享类型声明、常量和通用函数
│   ├── uno-preset               // UnoCSS 预设配置
│   └── utils                    // 全局通用的纯工具函数
├── .editorconfig                // 统一编辑器编码规范
├── .gitattributes               // Git 属性配置
├── .gitignore                   // Git 忽略文件配置
├── .npmrc                       // npm/pnpm 运行参数配置
├── eslint.config.js             // 根目录 ESLint 平铺配置文件 (引用自 packages)
├── package.json                 // Monorepo 根依赖及脚本管理
├── pnpm-lock.yaml               // pnpm 依赖锁定文件
├── pnpm-workspace.yaml          // pnpm 工作区定义文件
├── README.md                    // 项目英文介绍
├── tsconfig.base.json           // TS 基础共享配置
├── tsconfig.json                // TS 引用管理配置 (Project References)
├── uno.config.ts                // 原子 CSS 框架 UnoCSS 全局配置
└── vite.config.ts               // (可选) 根目录 Vite 公共配置
```

## 命令行工具

```bash
{
  // 构建打包(prod环境)
  "build": "vite build --mode prod",
  // 构建打包(test环境)
  "build:test": "vite build --mode test",
  // 删除主项目及子项目的 node_modules, dist, pnpm-lock.yaml
  "cleanup": "sa cleanup",
  // 提交代码 (生成符合 Conventional Commits standard 的提交信息)
  "commit": "sa git-commit",
  // 本地运行(test环境)
  "dev": "vite --mode test",
  // 本地运行(prod环境)
  "dev:prod": "vite --mode prod",
  // 生成路由
  "gen-route": "sa gen-route",
  // eslint检查并自动修复
  "lint": "eslint . --fix",
  // 初始化 simple-git-hooks
  "prepare": "simple-git-hooks",
  // 本地环境预览构建后的dist
  "preview": "vite preview",
  // 发布
  "release": "sa release",
  // vue文件的ts检查
  "typecheck": "vue-tsc --noEmit --skipLibCheck",
  // 更新依赖包
  "update-pkg": "sa update-pkg"
}
```