一个多端的 AI 手抄报生成应用，支持 H5 和微信小程序。专为幼儿园妈妈设计，通过一句话描述即可生成适合孩子的精美手抄报。
A multi-platform AI-powered handwritten newspaper generator for children, supporting H5 (Web) and WeChat Mini Program. Designed for kindergarten moms.
- 🎨 AI 生成 - 使用 Gemini 3 Pro 大模型生成精美手抄报
- 📝 简单输入 - 只需一句话描述主题即可
- 💡 示例提示 - 提供多个示例主题快速开始
- 💾 保存图片 - 保存作品到相册或下载
- 📱 多端支持 - 同时支持 H5 网页和微信小程序
- 🔐 安全配置 - API Key 本地存储，安全可靠
- Taro - 多端统一开发框架
- React - UI 组件库
- TypeScript - 类型安全
- Sass - CSS 预处理器
- Gemini 3 Pro - 万界方舟 AI 图像生成
npm install获取万界方舟 API Key：
- 访问 万界方舟
- 注册并登录账号
- 在个人中心获取 API Key
npm run dev:h5访问 http://localhost:10086 查看效果
npm run dev:weapp使用微信开发者工具打开 dist/weapp 目录
npm run build:h5npm run build:weapp本项目已配置 GitHub Actions 自动部署。只需：
-
在 GitHub 仓库设置中启用 Pages：
- 进入 Settings → Pages
- Source 选择 "GitHub Actions"
-
推送代码到
main分支，Actions 会自动构建并部署 -
访问
https://<username>.github.io/<repo-name>/查看
也可以手动构建并部署：
- 构建 H5 版本
npm run build:h5-
将
dist/h5目录的内容推送到gh-pages分支，或在 GitHub 仓库设置中配置 Pages -
访问
https://<username>.github.io/<repo-name>/即可使用
├── config/ # Taro 配置文件
│ ├── index.js # 主配置
│ ├── dev.js # 开发环境配置
│ └── prod.js # 生产环境配置
├── src/
│ ├── pages/
│ │ ├── index/ # 主页面（生成页面）
│ │ │ ├── index.tsx
│ │ │ ├── index.scss
│ │ │ └── index.config.ts
│ │ └── settings/ # 设置页面（API Key 配置）
│ │ ├── index.tsx
│ │ ├── index.scss
│ │ └── index.config.ts
│ ├── services/
│ │ └── api.ts # Gemini API 服务
│ ├── app.tsx # 应用入口
│ ├── app.scss # 全局样式
│ └── app.config.ts # 应用配置
├── package.json
├── project.config.json # 微信小程序项目配置
└── tsconfig.json
- 配置 API Key - 首次使用点击右上角设置图标配置 API Key
- 输入主题 - 在文本框中输入手抄报主题（如：春天来了，花儿开放）
- 使用示例 - 也可以点击示例标签快速填入主题
- 生成图片 - 点击"生成手抄报"按钮开始生成
- 等待生成 - AI 正在创作中，请耐心等待
- 保存作品 - 生成完成后点击"保存图片"保存到设备
本应用使用万界方舟提供的 Gemini API 接口调用 Gemini 3 Pro 模型：
- API 端点:
https://maas-openapi.wanjiedata.com/api/v1beta/models/gemini-3-pro-image-preview:generateContent - 模型名称:
gemini-3-pro-image-preview - 支持流式: 否（文生图接口不支持流式输出）
MIT
