mokee/mokeeText

Fork 0

Files

zg 4e0057ece5 初始化

2026-07-15 16:08:17 +08:00

4.3 KiB

Raw Blame History

name, description, metadata

name

description

metadata

session-20260623-1

2026-06-23 第1次会话 — MoKeeText 项目从零搭建到 Docker 部署

type	date	sessionNumber	startTime
session	2026-06-23	1	2026-06-23T14:00:00+08:00

2026-06-23 第1次会话

会话摘要

从零搭建 Web 记事本 MoKeeText，包含笔记编辑器（Tiptap 增强型）、网站账号密码管理、智能导入。技术栈：FastAPI + Vue 3 + Vite + MySQL。已部署到生产服务器 Docker。

关键决策

技术选型

做了什么: 选择 FastAPI + Vue3 + MySQL，放弃纯 Jinja2 模板方案
原因: Vue 组件化更适合复杂交互，FastAPI 轻量够用
结果: 前后端分离，前端 Vite 构建静态文件，后端纯 API

编辑器选型

做了什么: 使用 Tiptap 增强型编辑器
原因: 支持文字颜色、图片粘贴上传、表格、表情，飞书级别体验
结果: Tiptap 通过 esbuild 打包成本地文件（~460KB），无需 CDN

图片存储

做了什么: 图片存入 MySQL uploads 表的 LONGBLOB 字段，不存文件系统
原因: 部署简单，备份只要导出数据库
结果: 上传 API 返回 /api/file/{id}，支持 20MB 以内的图片

部署架构

做了什么: Docker Compose 部署，前端 Nginx :3006，后端 FastAPI :4006
原因: 生产环境标准化
结果: 前端不代理 API，Vue 直接跨域请求后端 https://mokeetext.server.zgitm.com

代码结构

mokeeText/
├── app.py              # FastAPI 入口 + CORS
├── models.py           # 6个模型：Folder/Note/Tag/Website/Account/Upload
├── routes/
│   ├── notes.py        # 笔记 CRUD + 分享 + 移动
│   ├── websites.py     # 网站/账号/文件夹 CRUD + 排序
│   ├── import_api.py   # 智能导入解析
│   ├── upload.py       # 图片上传/读取（存DB）
│   └── share.py        # 分享公开查看页
├── src/                # Vue 3 源码
│   ├── App.vue         # 左导航 + 顶栏 + 底栏
│   ├── views/
│   │   ├── NotesView.vue    # 笔记文档列表 + 编辑器
│   │   ├── WebsitesView.vue # 网站管理 + 弹窗
│   │   └── SharesView.vue   # 分享管理
│   └── components/
│       ├── NoteEditor.vue   # Tiptap 编辑器（图片粘贴/拖拽/预览）
│       ├── Modal.vue        # 通用弹窗
│       ├── ConfirmModal.vue # 确认弹窗
│       └── PromptModal.vue  # 输入弹窗
├── static/dist/        # Vue 构建产物
├── nginx.conf          # 前端 Nginx 配置（纯静态，无代理）
├── Dockerfile          # 后端镜像
├── Dockerfile.frontend # 前端镜像
└── docker-compose.yml  # 编排

数据库（MySQL 10.20.1.122:3306/mokeetext）

用户：mokeetext / mokee.
所有表均有 created_by / updated_by 字段（默认 admin）
notes.share_token + share_expires_at 支持分享链接有效期
accounts.sort_order 支持账号排序

生产环境

服务器：101.132.183.138 root/mokee2016.
项目目录：/data/mokee/mokeetext
前端：https://mokeetext.zgitm.com (:3006)
后端：https://mokeetext.server.zgitm.com (:4006)
日志：/data/mokee/mokeetext/logs（按天轮转，保留30天）
ICP备案：湘ICP备19021539号

UI 特性

左侧可收起导航（展开"mokee编辑器"，收起"M"）
笔记页文件夹侧边栏可收起
分享链接支持 7天/30天/1年/永久四种有效期
图片点击全屏预览（带关闭按钮）
Ctrl+S 保存，toast 提示
弹窗全部 Vue 组件（非浏览器 alert/confirm）
移动端响应式适配（768px 断点）

待处理

favicon.ico 前端图标
mokeetext.server.zgitm.com 反向代理配置（运维处理）
后续可加用户登录/权限系统

4.3 KiB Raw Blame History Unescape Escape