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