# SuperMarkdown

**Repository Path**: kk_495/SuperMarkdown

## Basic Information

- **Project Name**: SuperMarkdown
- **Description**: 免费 · 开源 · 跨平台（Windows / macOS / Linux）的所见即所得 Markdown 编辑器
- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2026-08-24
- **Last Updated**: 2026-09-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# SuperMarkdown

**免费 · 开源 · 跨平台（Windows / macOS / Linux）的所见即所得 Markdown 编辑器**，追求超越 Typora 的写作体验。

![License](https://img.shields.io/badge/license-MIT-blue.svg) ![Platform](https://img.shields.io/badge/platform-windows%20%7C%20macos%20%7C%20linux-lightgrey)

## 📸 预览

![预览 1](assets/Snipaste_2026-08-24_15-13-11.png)
![预览 2](assets/Snipaste_2026-08-24_15-14-06.png)
![预览 3](assets/Snipaste_2026-08-24_15-14-21.png)
![预览 4](assets/Snipaste_2026-08-24_15-14-42.png)

### 🧘 沉浸写作模式

**极简模式**（F9 进入 / Esc 退出）：隐藏标题栏、标签栏、工具栏、侧边栏、大纲与状态栏，只留纯粹编辑区，右上角悬浮「退出极简」按钮。

![极简模式](assets/preview-zen.png)

**专注模式**：光标所在段落保持高亮，其余内容自动淡化，长文写作更聚焦。

![专注模式](assets/preview-focus.png)

**打字机模式**：光标始终保持在视口垂直居中，写作区域随输入平滑滚动。

![打字机模式](assets/preview-typewriter.png)

**极简 + 专注叠加**：三种模式可自由组合，状态自动记忆。

![极简+专注](assets/preview-zen-focus.png)

## ✨ 特性

* 🖊️ **真正所见即所得**：基于 ProseMirror 内核，输入 Markdown 语法即时渲染，无源码/预览切换割裂感
* 🗂️ **多标签页**：同时编辑多个文档，标签栏快速切换，未保存状态标记；关闭最后一个标签回到欢迎主页
* 🔍 **全文搜索与替换**：Ctrl+F 搜索面板，实时高亮、逐条跳转、替换当前/全部替换，支持大小写切换
* 🖼️ **图片粘贴**：截图/图片直接粘贴或拖入，自动保存到文档同目录 `assets/` 并以可移植相对路径插入；基于文档目录解析显示，另存为自动迁移图片
* 🧘 **极简模式**：F9 一键隐藏标题栏 / 标签栏 / 工具栏 / 侧边栏 / 大纲 / 状态栏，只留纯粹编辑区，Esc 退出
* 🎯 **专注模式**：光标所在段落保持高亮，其余内容自动淡化，长文写作更聚焦
* ⌨️ **打字机模式**：光标始终保持在视口垂直居中，写作区域随输入平滑滚动
* 🧮 **数学公式**：行内 `$...$` 与块级 `$$...$$`，KaTeX 渲染，双击可编辑源码
* 📊 **Mermaid 图表**：流程图 / 时序图 / 甘特图等直接内嵌渲染，一键重新渲染
* 💻 **代码高亮**：highlight.js 支持数十种语言，暗色代码块 + 语言标签
* ✅ **任务列表**：GFM 语法，点击勾选框直接切换
* 📋 **表格**：Markdown 管道表格所见即所得编辑，Tab / Shift+Tab 单元格导航
* 📁 **文件管理**：打开文件、打开文件夹浏览、最近打开记录、拖拽打开
* 💾 **自动保存**：编辑后自动写入磁盘
* 🧭 **大纲导航**：根据标题自动生成，点击跳转
* 🎨 **主题**：亮色 / 暗色主题一键切换，跟随系统偏好
* 📤 **导出**：一键导出自包含 HTML 与 PDF（公式、图表全部静态内嵌）
* 🗂️ **打包分发**：electron-builder 一键打包 Windows 安装包 / macOS dmg / Linux AppImage+deb

## 🚀 快速开始

```bash
# 安装依赖（国内网络建议使用 npmmirror 镜像）
npm install --registry=https://registry.npmmirror.com
export ELECTRON_MIRROR="https://npmmirror.com/mirrors/electron/"   # Windows 用 set ELECTRON_MIRROR=...
npm install   # 再次执行以完成 Electron 二进制下载

# 开发模式（热更新）
npm run dev

# 类型检查 + 构建
npm run build

# 打包（按平台）
npm run dist:win     # Windows NSIS 安装包
npm run dist:mac     # macOS dmg（x64 + arm64）
npm run dist:linux   # Linux AppImage + deb
```

> 提示：`npm run icon` 生成应用图标，`npm run inline-katex` 内联 KaTeX 字体（构建导出 HTML/PDF 必需）。

## 📁 项目结构

```
src/
├── main/            # Electron 主进程（窗口、菜单、文件/导出 IPC）
├── preload/         # 预加载脚本（contextBridge 暴露 api）
└── renderer/        # 渲染进程
    ├── editor/      # ProseMirror 编辑器内核
    │   ├── schema.ts      # 文档模型（含 math / table / task 节点）
    │   ├── parser.ts      # Markdown → 文档（markdown-it + 自定义 token）
    │   ├── serializer.ts  # 文档 → Markdown
    │   ├── nodeviews.ts   # 代码块 / 公式 / 图片节点视图
    │   ├── plugins.ts     # 快捷键 / 输入规则 / 表格导航 / 占位符
    │   └── export.ts      # 自包含 HTML / PDF 导出
    ├── components/   # 标题栏 / 工具栏 / 侧边栏 / 大纲 / 状态栏 / 模态框
    └── store.ts      # zustand 全局状态
```

## 🛣️ 路线图

* [x] 多标签页编辑
* [x] 全文搜索与替换
* [x] 图片粘贴与自动存储
* [x] 极简模式 / 专注模式 / 打字机模式
* [ ] 主题商城与自定义主题
* [ ] 插件系统
* [ ] 自动更新（Release 分发）
* [ ] 导出 Word / LaTeX

## 🤝 参与贡献

欢迎提交 Issue 与 Pull Request！

1. Fork 本仓库并克隆
2. `npm install && npm run dev` 本地开发
3. 提交前请运行 `npm run typecheck` 与 `npm run build`

## 📄 开源协议

本项目基于 [MIT License](./LICENSE) 开源，完全免费，可自由使用、修改与分发。

## ☕ 支持我们

SuperMarkdown 完全免费开源。如果你喜欢这个项目，欢迎通过以下方式支持：

* **[爱发电](https://afdian.com/a/csqk495)**：为开发者买杯咖啡 ☕
* ⭐ Star 项目、提交 Issue / PR 也是最好的支持