# MathTool

**Repository Path**: jiayanwen/MathTool

## Basic Information

- **Project Name**: MathTool
- **Description**: 幼儿园小学生加减乘除练习工具
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-09-10
- **Last Updated**: 2026-09-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# demo01

基于 **Vue 3 + Vite + Vue Router + Pinia** 的前端项目基本框架，开箱即用。

## 技术栈

| 类别 | 选型 | 版本 |
| --- | --- | --- |
| 框架 | Vue | ^3.5 |
| 构建工具 | Vite | ^8 |
| 路由 | Vue Router | ^5 |
| 状态管理 | Pinia | ^4 |

## 快速开始

```bash
# 安装依赖
npm install

# 启动开发服务器（默认 http://localhost:5173）
npm run dev

# 生产构建
npm run build

# 本地预览生产构建产物
npm run preview
```

## 目录结构

```
demo01/
├── public/                 # 静态资源（不经过构建，按根路径引用）
├── src/
│   ├── assets/             # 静态资源（经构建处理的图片、样式等）
│   ├── components/         # 通用组件
│   │   └── MathSheet.vue   #   A4 题目纸组件（口算练习）
│   ├── router/             # 路由配置
│   │   └── index.js        #   路由表 + 全局守卫（/ 重定向到口算练习）
│   ├── stores/             # Pinia 状态管理
│   ├── utils/              # 工具函数
│   │   ├── arithmetic.js   #   口算题生成算法
│   │   ├── exportPdf.js    #   A4 PDF 导出（html2canvas + jsPDF）
│   │   └── layout.js       #   A4 排版与分页计算
│   ├── views/              # 页面视图
│   │   └── MathPracticeView.vue  # 口算练习生成器（/math）
│   ├── App.vue             # 根组件（全局布局 + 路由出口）
│   ├── main.js             # 应用入口
│   └── style.css           # 全局样式与 CSS 变量
├── .gitignore
├── index.html              # HTML 入口模板
├── package.json
└── vite.config.js          # Vite 配置（已配置 @ → src 别名）
```

## 常用约定

- **路径别名**：`@` 指向 `src` 目录，例如 `@/views/HomeView.vue`
- **新增页面**：在 `src/views/` 下新建组件 → 在 `src/router/index.js` 的路由表中注册
- **新增状态**：在 `src/stores/` 下新建 store，使用 `defineStore` 定义，组件内通过 `useXxxStore()` 使用
- **页面标题**：路由 `meta.title` 已接入全局后置守卫，自动同步浏览器标题