From bbaea2df3e6ab573abeeed68bf1115549fb95410 Mon Sep 17 00:00:00 2001 From: thzxx Date: Sun, 9 Aug 2026 22:07:15 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E6=9B=B4=E6=96=B0=E5=85=B3=E4=BA=8E?= =?UTF-8?q?=E5=BC=B9=E6=A1=86=E4=B8=8E=20README=EF=BC=88=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=E7=8A=B6=E6=80=81=E6=A0=8F=E3=80=81=E4=BE=9D=E8=B5=96=E7=89=88?= =?UTF-8?q?=E6=9C=AC=200.4.1/0.4.4=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 579 +++++++++--------- .../components/AboutDialog/AboutDialog.tsx | 3 +- 2 files changed, 290 insertions(+), 292 deletions(-) diff --git a/README.md b/README.md index 2dad2c6..f6dbb84 100644 --- a/README.md +++ b/README.md @@ -1,290 +1,289 @@ -

- MarkLite -

- -

MarkLite

- -

- 轻量级 Windows 本地 Markdown 编辑器 -

- -

- Platform - Electron - TypeScript - React - License - Version -

- -

- 基于 Electron + React + TypeScript 构建的现代化 Markdown 桌面编辑器。
- 多标签页 · 实时预览 · 代码高亮 · 暗色主题 · 拖拽打开 · 搜索替换 · 文件树 · Mermaid 图表 · 状态持久化。 -

- ---- - -## ✨ 功能特性 - -| 功能 | 说明 | -|------|------| -| 📑 **多标签页** | 同时打开多个文件，Ctrl+T 新建、Ctrl+W 关闭、Ctrl+Tab MRU 切换 | -| 📂 **文件打开** | 按钮打开 / 拖拽打开 / 文件关联（双击 .md） / 命令行参数 | -| ✏️ **编辑器** | 基于 MetonaEditor 的代码+预览编辑器，内置解析器渲染、格式化工具栏、浮动格式栏、三模式切换（编辑/分屏/预览）、搜索替换、撤销重做、Zen 专注模式、粘贴图片转 base64 | -| 👁 **实时预览** | 分屏模式下左侧编辑、右侧实时预览，MetonaEditor 内置解析器渲染 | -| 🔤 **代码高亮** | MetonaEditor 内置零依赖高亮器（js / ts / python / bash / css / html / json 等 16 种语言） | -| 🎨 **三种视图** | 编辑模式 / 分屏模式 / 预览模式，自由切换 | -| 🌙 **暗色主题** | 一键切换亮色/暗色/暖色主题，偏好自动记忆（MetonaSqlark），编辑器主题同步切换 | -| 🔔 **文件监听** | 外部修改文件时自动提示，支持重新加载或忽略 | -| 💾 **文件保存** | 保存 / 另存为，支持 .md / .markdown / .txt 格式 | -| 🔍 **搜索替换** | Ctrl+F 搜索、Ctrl+H 替换，支持正则表达式、大小写敏感 | -| 📁 **文件树** | 侧边栏浏览项目目录，点击打开文件，目录变化自动刷新 | -| 📊 **Mermaid 图表** | 代码块中渲染 Mermaid 流程图 / 时序图 / 甘特图等 | -| 📋 **状态栏** | 实时显示文档字数 / 行数 / 阅读时间 / 光标位置 / 自动保存状态 | -| 💾 **状态持久化** | 标签页状态、用户设置通过 MetonaSqlark（AriaEngine）持久化，关闭后可恢复 | -| 📦 **数据备份** | 一键导出/导入全部数据为 JSON 文件（MetonaSqlark exportAll/importTable） | -| ⌨️ **快捷键** | 完整的键盘快捷键支持，操作高效 | -| 📦 **NSIS 安装包** | 一键打包为 Windows exe 安装程序 / 便携版 | -| 🖼️ **粘贴图片** | Ctrl+V 粘贴剪贴板图片，自动转为 base64 内嵌 | -| 📝 **文档大纲** | 侧边栏显示当前文档标题结构，点击导航 | -| 🧹 **自动保存** | 文件修改后 2 秒防抖自动保存，可在工具栏开关 | - -## 🚀 快速开始 - -### 环境要求 - -- **Node.js** >= 18.x -- **npm** >= 9.x -- **Windows** 10/11 x64 - -### 安装与运行 - -```bash -# 克隆仓库 -git clone https://git.metona.cn/MetonaTeam/MarkLite.git -cd MarkLite - -# 安装依赖 -npm install - -# 启动开发模式（带 HMR 热更新） -npm run dev -``` - -### 打包为 exe 安装包 - -```bash -# 打包 Windows x64 NSIS 安装包 -npm run build - -# 打包为便携版（免安装） -npm run build:portable -``` - -打包完成后，安装包位于 `dist/` 目录。详见 [DEVSETUP.md](DEVSETUP.md)。 - -### 其他命令 - -```bash -# TypeScript 类型检查 -npm run typecheck - -# ESLint 代码检查 -npm run lint - -# 运行单元测试 -npm run test - -# 监听模式运行测试 -npm run test:watch - -# 生成测试覆盖率报告 -npm run test:coverage -``` - -## 🧪 测试 - -项目使用 **Vitest** + **React Testing Library** 作为测试框架。 - -```bash -# 运行全部测试 -npm run test - -# 监听模式（开发时持续运行） -npm run test:watch - -# 生成覆盖率报告 -npm run test:coverage -``` - -测试覆盖以下核心模块： -- `stores/` — Zustand 状态管理（tabStore, editorStore） -- `lib/` — 工具库（fileUtils, markdown, errorHandler） -- `hooks/` — 自定义 Hooks - -## ⌨️ 快捷键 - -| 快捷键 | 功能 | -|:-------|:-----| -| `Ctrl + T` | 新建标签页 | -| `Ctrl + W` | 关闭当前标签页 | -| `Ctrl + Tab` | 切换到下一个标签页（MRU 顺序） | -| `Ctrl + Shift + Tab` | 切换到上一个标签页 | -| `Ctrl + O` | 打开文件 | -| `Ctrl + S` | 保存文件 | -| `Ctrl + Shift + S` | 另存为 | -| `Ctrl + F` | 搜索 | -| `Ctrl + H` | 搜索并替换 | -| `Ctrl + Z` / `Ctrl + Y` | 撤销 / 重做 | -| `Ctrl + B` / `Ctrl + I` | 粗体 / 斜体（编辑器内置） | -| `Ctrl + E` / `Ctrl + K` / `Ctrl + Q` | 行内代码 / 链接 / 引用（编辑器内置） | -| `Ctrl + 1/2/3` | 切换模式（编辑器内置） | -| `?` | 快捷键帮助面板（编辑器内置） | - -## 🛠️ 技术栈 - -| 组件 | 技术 | 说明 | -|:-----|:-----|:-----| -| 桌面框架 | [Electron](https://www.electronjs.org/) v28 | 跨平台桌面应用框架 | -| 前端框架 | [React](https://react.dev/) v18 | 函数组件 + Hooks | -| 类型系统 | [TypeScript](https://www.typescriptlang.org/) v5.6 | 全量类型安全 | -| 编辑器 | [MetonaEditor](https://git.metona.cn/MetonaTeam/MetonaEditor) v0.4.0 | 内置解析器 + 高亮，三模式视图 + 浮动格式栏 + Zen 模式 + 插件系统 | -| 状态管理 | [Zustand](https://zustand-demo.pmnd.rs/) v5 | 轻量级状态管理 | -| 持久化 | [MetonaSqlark](https://git.metona.cn/MetonaTeam/MetonaSqlark) v0.4.1 (IndexedDB, AriaEngine) | 标签页状态 & 用户设置持久化 | -| Markdown 解析 | MetonaEditor 内置解析器 | 零依赖：GFM / 脚注 / 数学公式 / Mermaid | -| 代码高亮 | MetonaEditor 内置高亮器 | 零依赖，16 种语言 | -| Toast | [@metona-team/metona-toast](https://git.metona.cn/MetonaTeam/-/packages/npm/@metona-team%2Fmetona-toast) v0.5.0 | 通知提示组件 | -| 构建工具 | [electron-vite](https://electron-vite.org/) v3 | Electron + Vite 集成，HMR 热更新 | -| 打包工具 | [electron-builder](https://www.electron.build/) | 生成 exe 安装包 | -| 样式 | CSS Variables | 主题驱动，亮色/暗色切换 | - -## 📁 项目结构 - -``` -MarkLite/ -├── package.json # 项目配置 & 依赖 & electron-builder 打包配置 -├── tsconfig.json # TypeScript 配置 -├── tsconfig.node.json # Node 端 TypeScript 配置 -├── electron.vite.config.ts # electron-vite 构建配置 -├── vitest.config.ts # Vitest 测试框架配置 -├── eslint.config.mjs # ESLint + TypeScript 规则 -├── CONTRIBUTING.md # 贡献指南 -│ -├── src/ -│ ├── main/ # 主进程 (Node.js) -│ │ ├── index.ts # 入口：窗口创建、app 生命周期、单实例锁 -│ │ ├── ipc-handlers.ts # 所有 ipcMain.handle 注册 -│ │ ├── file-system.ts # 文件读写、目录树构建、BOM 剥离 -│ │ ├── file-watcher.ts # fs.watch 封装（单文件 + 目录监听） -│ │ └── window-manager.ts # 窗口创建、关闭拦截、单实例锁 -│ │ -│ ├── preload/ # 预加载脚本 -│ │ └── index.ts # contextBridge 类型安全暴露 -│ │ -│ ├── renderer/ # 渲染进程 (React 18) -│ │ ├── index.html # 入口 HTML（含 CSP 策略） -│ │ ├── main.tsx # React 入口 -│ │ ├── App.tsx # 根组件：布局编排、全局事件 -│ │ │ -│ │ ├── components/ # UI 组件 -│ │ │ ├── Toolbar/ # 工具栏（文件操作、自动保存、主题、关于） -│ │ │ ├── TabBar/ # 标签页栏（含拖拽排序、右键菜单） -│ │ │ ├── Editor/ # MetonaEditor 编辑器集成 -│ │ │ ├── Sidebar/ # 侧边栏文件树 + 文档大纲 -│ │ │ ├── FileTree/ # 递归文件树 -│ │ │ ├── OutlinePanel/ # 文档大纲（活跃标题高亮） -│ │ │ ├── WelcomeScreen/ # 欢迎屏幕（应用图标、最近文件） -│ │ │ ├── ConfirmDialog/ # 确认对话框 -│ │ │ ├── ModifiedBanner/ # 文件外部修改提示 -│ │ │ ├── DropOverlay/ # 拖拽文件覆盖层 -│ │ │ ├── ErrorBoundary/ # 错误边界 -│ │ │ ├── AboutDialog/ # 关于对话框 -│ │ │ ├── LoadingSpinner/ # 加载指示器 -│ │ │ └── Icons.tsx # SVG 图标库 -│ │ │ -│ │ ├── stores/ # Zustand 状态管理 -│ │ │ ├── tabStore.ts # 标签页状态 -│ │ │ ├── editorStore.ts # 编辑器状态 -│ │ │ ├── sidebarStore.ts # 侧边栏状态 -│ │ │ └── autoSaveStore.ts # 自动保存状态 -│ │ │ -│ │ ├── hooks/ # 自定义 Hooks -│ │ │ ├── useTheme.ts # 暗色/亮色主题 -│ │ │ ├── useSettingsInit.ts # 设置初始加载 -│ │ │ ├── useKeyboard.ts # 全局快捷键 -│ │ │ ├── useDragDrop.ts # 拖拽打开 -│ │ │ ├── useFileWatch.ts # 外部修改监听 -│ │ │ ├── useUnsavedWarning.ts # 未保存提醒 -│ │ │ ├── useAutoSave.ts # 自动保存（Electron IPC） -│ │ │ ├── useAutoExpandDir.ts # 自动展开目录 -│ │ │ ├── useActiveHeading.ts # 活跃标题追踪 -│ │ │ ├── useDocStats.ts # 文档统计 -│ │ │ └── ... # 文件操作、IPC监听等 -│ │ │ -│ │ ├── lib/ # 工具库 -│ │ │ ├── markdown.ts # Markdown 渲染管线（unified/rehype） -│ │ │ ├── fileUtils.ts # 文件工具函数 -│ │ │ ├── errorHandler.ts # 错误处理 -│ │ │ ├── toast.ts # Toast 通知（MetonaToast） -│ │ │ └── constants.ts # 常量定义 -│ │ │ -│ │ ├── db/ # MetonaSqlark 持久化层 -│ │ │ ├── schema.ts # 数据库定义（懒初始化单例） -│ │ │ ├── tabRepository.ts # 标签页 CRUD -│ │ │ ├── settingsRepository.ts # 设置 CRUD -│ │ │ └── recentFilesRepository.ts # 最近文件 -│ │ │ -│ │ ├── types/ # TypeScript 类型 -│ │ └── styles/ # 全局样式 -│ │ -│ └── shared/ # 主进程/渲染进程共享 -│ ├── ipc-channels.ts # IPC 通道名常量 -│ ├── types.ts # 共享类型定义 -│ └── constants.ts # 共享常量（版本号等） -│ -├── assets/ -│ └── icon.ico # 应用图标 -├── DESIGN.md # 架构设计文档 -├── DEVSETUP.md # 开发环境配置指南 -├── LICENSE # MIT 许可证 -└── README.md # 本文件 -``` - -## 📝 支持的 Markdown 语法 - -- ✅ 标题（h1 ~ h6） -- ✅ **粗体** / *斜体* / ~~删除线~~ -- ✅ 高亮标记 `==text==` / 上标 `x^2^` / 下标 `H~2~O` -- ✅ 有序列表 / 无序列表 -- ✅ 任务列表 `- [x]` -- ✅ 代码块（围栏式 + 语法高亮，180+ 语言） -- ✅ 行内代码 -- ✅ 链接 / 图片（支持相对路径、粘贴图片） -- ✅ 表格（含列对齐） -- ✅ 引用块 -- ✅ 水平线 -- ✅ Emoji 短码 `:smile:` `:rocket:` -- ✅ Mermaid 图表 ` ```mermaid ` -- ✅ HTML 内联元素 -- ✅ GFM（GitHub Flavored Markdown） - -## 🔧 Git Hooks - -项目使用 **Husky** + **lint-staged** 自动执行代码检查： - -- **pre-commit**: 对暂存的 `.ts/.tsx` 文件运行 ESLint 和 TypeScript 类型检查；对 `.json/.css/.md` 文件运行 Prettier 格式化 - -```bash -# 初始化 git hooks（npm install 时自动执行） -npm run prepare -``` - -## 📄 许可证 - -[MIT License](LICENSE) © 2026 [thzxx](https://git.metona.cn/thzxx) - ---- - -

- 如果觉得有用，请点个 ⭐ Star 支持一下！ -

+

+ MarkLite +

+ +

MarkLite

+ +

+ 轻量级 Windows 本地 Markdown 编辑器 +

+ +

+ Platform + Electron + TypeScript + React + License + Version +

+ +

+ 基于 Electron + React + TypeScript 构建的现代化 Markdown 桌面编辑器。
+ 多标签页 · 实时预览 · 代码高亮 · 暗色主题 · 拖拽打开 · 搜索替换 · 文件树 · Mermaid 图表 · 状态持久化。 +

+ +--- + +## ✨ 功能特性 + +| 功能 | 说明 | +|------|------| +| 📑 **多标签页** | 同时打开多个文件，Ctrl+T 新建、Ctrl+W 关闭、Ctrl+Tab MRU 切换 | +| 📂 **文件打开** | 按钮打开 / 拖拽打开 / 文件关联（双击 .md） / 命令行参数 | +| ✏️ **编辑器** | 基于 MetonaEditor 的代码+预览编辑器，内置解析器渲染、格式化工具栏、浮动格式栏、三模式切换（编辑/分屏/预览）、搜索替换、撤销重做、Zen 专注模式、粘贴图片转 base64 | +| 👁 **实时预览** | 分屏模式下左侧编辑、右侧实时预览，MetonaEditor 内置解析器渲染 | +| 🔤 **代码高亮** | MetonaEditor 内置零依赖高亮器（js / ts / python / bash / css / html / json 等 16 种语言） | +| 🎨 **三种视图** | 编辑模式 / 分屏模式 / 预览模式，自由切换 | +| 🌙 **暗色主题** | 一键切换亮色/暗色/暖色主题，偏好自动记忆（MetonaSqlark），编辑器主题同步切换 | +| 🔔 **文件监听** | 外部修改文件时自动提示，支持重新加载或忽略 | +| 💾 **文件保存** | 保存 / 另存为，支持 .md / .markdown / .txt 格式 | +| 🔍 **搜索替换** | Ctrl+F 搜索、Ctrl+H 替换，支持正则表达式、大小写敏感 | +| 📁 **文件树** | 侧边栏浏览项目目录，点击打开文件，目录变化自动刷新 | +| 📊 **Mermaid 图表** | 代码块中渲染 Mermaid 流程图 / 时序图 / 甘特图等 | +| 💾 **状态持久化** | 标签页状态、用户设置通过 MetonaSqlark（AriaEngine）持久化，关闭后可恢复 | +| 📦 **数据备份** | 一键导出/导入全部数据为 JSON 文件（MetonaSqlark exportAll/importTable） | +| ⌨️ **快捷键** | 完整的键盘快捷键支持，操作高效 | +| 📦 **NSIS 安装包** | 一键打包为 Windows exe 安装程序 / 便携版 | +| 🖼️ **粘贴图片** | Ctrl+V 粘贴剪贴板图片，自动转为 base64 内嵌 | +| 📝 **文档大纲** | 侧边栏显示当前文档标题结构，点击导航 | +| 🧹 **自动保存** | 文件修改后 2 秒防抖自动保存，可在工具栏开关 | + +## 🚀 快速开始 + +### 环境要求 + +- **Node.js** >= 18.x +- **npm** >= 9.x +- **Windows** 10/11 x64 + +### 安装与运行 + +```bash +# 克隆仓库 +git clone https://git.metona.cn/MetonaTeam/MarkLite.git +cd MarkLite + +# 安装依赖 +npm install + +# 启动开发模式（带 HMR 热更新） +npm run dev +``` + +### 打包为 exe 安装包 + +```bash +# 打包 Windows x64 NSIS 安装包 +npm run build + +# 打包为便携版（免安装） +npm run build:portable +``` + +打包完成后，安装包位于 `dist/` 目录。详见 [DEVSETUP.md](DEVSETUP.md)。 + +### 其他命令 + +```bash +# TypeScript 类型检查 +npm run typecheck + +# ESLint 代码检查 +npm run lint + +# 运行单元测试 +npm run test + +# 监听模式运行测试 +npm run test:watch + +# 生成测试覆盖率报告 +npm run test:coverage +``` + +## 🧪 测试 + +项目使用 **Vitest** + **React Testing Library** 作为测试框架。 + +```bash +# 运行全部测试 +npm run test + +# 监听模式（开发时持续运行） +npm run test:watch + +# 生成覆盖率报告 +npm run test:coverage +``` + +测试覆盖以下核心模块： +- `stores/` — Zustand 状态管理（tabStore, editorStore） +- `lib/` — 工具库（fileUtils, markdown, errorHandler） +- `hooks/` — 自定义 Hooks + +## ⌨️ 快捷键 + +| 快捷键 | 功能 | +|:-------|:-----| +| `Ctrl + T` | 新建标签页 | +| `Ctrl + W` | 关闭当前标签页 | +| `Ctrl + Tab` | 切换到下一个标签页（MRU 顺序） | +| `Ctrl + Shift + Tab` | 切换到上一个标签页 | +| `Ctrl + O` | 打开文件 | +| `Ctrl + S` | 保存文件 | +| `Ctrl + Shift + S` | 另存为 | +| `Ctrl + F` | 搜索 | +| `Ctrl + H` | 搜索并替换 | +| `Ctrl + Z` / `Ctrl + Y` | 撤销 / 重做 | +| `Ctrl + B` / `Ctrl + I` | 粗体 / 斜体（编辑器内置） | +| `Ctrl + E` / `Ctrl + K` / `Ctrl + Q` | 行内代码 / 链接 / 引用（编辑器内置） | +| `Ctrl + 1/2/3` | 切换模式（编辑器内置） | +| `?` | 快捷键帮助面板（编辑器内置） | + +## 🛠️ 技术栈 + +| 组件 | 技术 | 说明 | +|:-----|:-----|:-----| +| 桌面框架 | [Electron](https://www.electronjs.org/) v28 | 跨平台桌面应用框架 | +| 前端框架 | [React](https://react.dev/) v18 | 函数组件 + Hooks | +| 类型系统 | [TypeScript](https://www.typescriptlang.org/) v5.6 | 全量类型安全 | +| 编辑器 | [MetonaEditor](https://git.metona.cn/MetonaTeam/MetonaEditor) v0.4.1 | 内置解析器 + 高亮，三模式视图 + 浮动格式栏 + Zen 模式 + 插件系统 | +| 状态管理 | [Zustand](https://zustand-demo.pmnd.rs/) v5 | 轻量级状态管理 | +| 持久化 | [MetonaSqlark](https://git.metona.cn/MetonaTeam/MetonaSqlark) v0.4.4 (IndexedDB, AriaEngine) | 标签页状态 & 用户设置持久化 | +| Markdown 解析 | MetonaEditor 内置解析器 | 零依赖：GFM / 脚注 / 数学公式 / Mermaid | +| 代码高亮 | MetonaEditor 内置高亮器 | 零依赖，16 种语言 | +| Toast | [@metona-team/metona-toast](https://git.metona.cn/MetonaTeam/-/packages/npm/@metona-team%2Fmetona-toast) v0.5.0 | 通知提示组件 | +| 构建工具 | [electron-vite](https://electron-vite.org/) v3 | Electron + Vite 集成，HMR 热更新 | +| 打包工具 | [electron-builder](https://www.electron.build/) | 生成 exe 安装包 | +| 样式 | CSS Variables | 主题驱动，亮色/暗色切换 | + +## 📁 项目结构 + +``` +MarkLite/ +├── package.json # 项目配置 & 依赖 & electron-builder 打包配置 +├── tsconfig.json # TypeScript 配置 +├── tsconfig.node.json # Node 端 TypeScript 配置 +├── electron.vite.config.ts # electron-vite 构建配置 +├── vitest.config.ts # Vitest 测试框架配置 +├── eslint.config.mjs # ESLint + TypeScript 规则 +├── CONTRIBUTING.md # 贡献指南 +│ +├── src/ +│ ├── main/ # 主进程 (Node.js) +│ │ ├── index.ts # 入口：窗口创建、app 生命周期、单实例锁 +│ │ ├── ipc-handlers.ts # 所有 ipcMain.handle 注册 +│ │ ├── file-system.ts # 文件读写、目录树构建、BOM 剥离 +│ │ ├── file-watcher.ts # fs.watch 封装（单文件 + 目录监听） +│ │ └── window-manager.ts # 窗口创建、关闭拦截、单实例锁 +│ │ +│ ├── preload/ # 预加载脚本 +│ │ └── index.ts # contextBridge 类型安全暴露 +│ │ +│ ├── renderer/ # 渲染进程 (React 18) +│ │ ├── index.html # 入口 HTML（含 CSP 策略） +│ │ ├── main.tsx # React 入口 +│ │ ├── App.tsx # 根组件：布局编排、全局事件 +│ │ │ +│ │ ├── components/ # UI 组件 +│ │ │ ├── Toolbar/ # 工具栏（文件操作、自动保存、主题、关于） +│ │ │ ├── TabBar/ # 标签页栏（含拖拽排序、右键菜单） +│ │ │ ├── Editor/ # MetonaEditor 编辑器集成 +│ │ │ ├── Sidebar/ # 侧边栏文件树 + 文档大纲 +│ │ │ ├── FileTree/ # 递归文件树 +│ │ │ ├── OutlinePanel/ # 文档大纲（活跃标题高亮） +│ │ │ ├── WelcomeScreen/ # 欢迎屏幕（应用图标、最近文件） +│ │ │ ├── ConfirmDialog/ # 确认对话框 +│ │ │ ├── ModifiedBanner/ # 文件外部修改提示 +│ │ │ ├── DropOverlay/ # 拖拽文件覆盖层 +│ │ │ ├── ErrorBoundary/ # 错误边界 +│ │ │ ├── AboutDialog/ # 关于对话框 +│ │ │ ├── LoadingSpinner/ # 加载指示器 +│ │ │ └── Icons.tsx # SVG 图标库 +│ │ │ +│ │ ├── stores/ # Zustand 状态管理 +│ │ │ ├── tabStore.ts # 标签页状态 +│ │ │ ├── editorStore.ts # 编辑器状态 +│ │ │ ├── sidebarStore.ts # 侧边栏状态 +│ │ │ └── autoSaveStore.ts # 自动保存状态 +│ │ │ +│ │ ├── hooks/ # 自定义 Hooks +│ │ │ ├── useTheme.ts # 暗色/亮色主题 +│ │ │ ├── useSettingsInit.ts # 设置初始加载 +│ │ │ ├── useKeyboard.ts # 全局快捷键 +│ │ │ ├── useDragDrop.ts # 拖拽打开 +│ │ │ ├── useFileWatch.ts # 外部修改监听 +│ │ │ ├── useUnsavedWarning.ts # 未保存提醒 +│ │ │ ├── useAutoSave.ts # 自动保存（Electron IPC） +│ │ │ ├── useAutoExpandDir.ts # 自动展开目录 +│ │ │ ├── useActiveHeading.ts # 活跃标题追踪 +│ │ │ ├── useDocStats.ts # 文档统计 +│ │ │ └── ... # 文件操作、IPC监听等 +│ │ │ +│ │ ├── lib/ # 工具库 +│ │ │ ├── markdown.ts # Markdown 渲染管线（unified/rehype） +│ │ │ ├── fileUtils.ts # 文件工具函数 +│ │ │ ├── errorHandler.ts # 错误处理 +│ │ │ ├── toast.ts # Toast 通知（MetonaToast） +│ │ │ └── constants.ts # 常量定义 +│ │ │ +│ │ ├── db/ # MetonaSqlark 持久化层 +│ │ │ ├── schema.ts # 数据库定义（懒初始化单例） +│ │ │ ├── tabRepository.ts # 标签页 CRUD +│ │ │ ├── settingsRepository.ts # 设置 CRUD +│ │ │ └── recentFilesRepository.ts # 最近文件 +│ │ │ +│ │ ├── types/ # TypeScript 类型 +│ │ └── styles/ # 全局样式 +│ │ +│ └── shared/ # 主进程/渲染进程共享 +│ ├── ipc-channels.ts # IPC 通道名常量 +│ ├── types.ts # 共享类型定义 +│ └── constants.ts # 共享常量（版本号等） +│ +├── assets/ +│ └── icon.ico # 应用图标 +├── DESIGN.md # 架构设计文档 +├── DEVSETUP.md # 开发环境配置指南 +├── LICENSE # MIT 许可证 +└── README.md # 本文件 +``` + +## 📝 支持的 Markdown 语法 + +- ✅ 标题（h1 ~ h6） +- ✅ **粗体** / *斜体* / ~~删除线~~ +- ✅ 高亮标记 `==text==` / 上标 `x^2^` / 下标 `H~2~O` +- ✅ 有序列表 / 无序列表 +- ✅ 任务列表 `- [x]` +- ✅ 代码块（围栏式 + 语法高亮，180+ 语言） +- ✅ 行内代码 +- ✅ 链接 / 图片（支持相对路径、粘贴图片） +- ✅ 表格（含列对齐） +- ✅ 引用块 +- ✅ 水平线 +- ✅ Emoji 短码 `:smile:` `:rocket:` +- ✅ Mermaid 图表 ` ```mermaid ` +- ✅ HTML 内联元素 +- ✅ GFM（GitHub Flavored Markdown） + +## 🔧 Git Hooks + +项目使用 **Husky** + **lint-staged** 自动执行代码检查： + +- **pre-commit**: 对暂存的 `.ts/.tsx` 文件运行 ESLint 和 TypeScript 类型检查；对 `.json/.css/.md` 文件运行 Prettier 格式化 + +```bash +# 初始化 git hooks（npm install 时自动执行） +npm run prepare +``` + +## 📄 许可证 + +[MIT License](LICENSE) © 2026 [thzxx](https://git.metona.cn/thzxx) + +--- + +

+ 如果觉得有用，请点个 ⭐ Star 支持一下！ +

diff --git a/src/renderer/components/AboutDialog/AboutDialog.tsx b/src/renderer/components/AboutDialog/AboutDialog.tsx index 9f65447..ea63db6 100644 --- a/src/renderer/components/AboutDialog/AboutDialog.tsx +++ b/src/renderer/components/AboutDialog/AboutDialog.tsx @@ -42,7 +42,6 @@ export const AboutDialog = React.memo(function AboutDialog({ onClose }: AboutDia 文件树 文档大纲 浮动格式栏 - 状态栏 数据备份 状态持久化 @@ -53,7 +52,7 @@ export const AboutDialog = React.memo(function AboutDialog({ onClose }: AboutDia git.metona.cn/MetonaTeam/MarkLite

基于 Electron + React + TypeScript 构建

-

MetonaEditor 0.4.0 · MetonaToast 0.5.0 · MetonaSqlark 0.4.1

+

MetonaEditor 0.4.1 · MetonaToast 0.5.0 · MetonaSqlark 0.4.4

© 2026 thzxx