类似 typora 的新一代 Markdown 编辑器

Summer - 新一代 Markdown 编辑器

引言

在 Markdown 编辑器领域,Typora 以其所见即所得的编辑体验赢得了众多用户的喜爱。

再后来了解到了 milkup, milkup 基本实现了 typora 的大部分功能，而且界面更加现代化，同时也是开源免费的。

可是基于 electron 的体积较大，同时可扩展性（在不改变源程序下的自定义）并不是很多。对于普通用户而言并不是什么缺点，但是对于很多想要diy的用户来说，也许是个问题。

作为一名开发者,我一直想打造一款既现代化又高度可扩展的 Markdown 编辑器。于是,Summer 诞生了。

Summer 是我个人开发的一款开源 Markdown 编辑器,它采用了类似 VS Code 的插件化架构,基于 Tauri + Vue 3 + Milkdown 构建。

虽然目前功能还不够完善,但我希望通过开源的方式,让更多人参与进来,一起打造一款真正好用的编辑器。

同时也希望在后面个人没有时间开发的时候，这个项目也能借助开源的力量持续下去。

核心特性

1. 插件系统(开发中)

Summer 最大的特色是插件化架构。我希望它能像 VS Code 一样,通过插件来扩展各种功能:

核心插件: 主题管理、图片上传、AI 助手、导出功能、斜杠菜单等核心功能均以插件形式实现
外部插件支持: 支持加载第三方插件,插件开发者可以自由扩展编辑器功能
插件隔离: 每个插件拥有独立的运行时环境,互不干扰
热加载: 支持动态加载和卸载插件,无需重启应用

插件开发友好

Summer 为插件开发者提供了完善的开发体验:

typescript 复制代码

// 插件示例
export default class MyPlugin implements ISummerPlugin {
  async activate(runtime: PluginRuntime): Promise<void> {
    // 注册命令
    runtime.commands.register({
      id: 'my-plugin.hello',
      title: '打招呼',
      handler: () => runtime.ui.toast.success('你好!')
    })
    
    // 注册菜单
    runtime.menus.registerTopMenu('my-plugin', {
      id: 'my-menu',
      label: '我的菜单',
      // ...
    })
  }
}

共享依赖机制: 为避免插件体积过大和版本冲突,我实现了共享依赖系统。Milkdown、CodeMirror 等核心库由主程序统一提供,插件无需打包这些依赖,体积可减少 70% 以上。

注意: 虽然插件系统的基础架构已经完成,但由于 API 还在快速迭代中,暂时不建议开发第三方插件。我会在功能稳定后再正式开放。

2. 现代化技术栈

我选择了最新的技术栈来构建 Summer:

Tauri 2.x: 跨平台桌面应用框架,相比 Electron 更轻量、更安全
Vue 3 + TypeScript: 现代化的前端框架,类型安全
Milkdown 7.x: 基于 ProseMirror 的强大 Markdown 编辑器内核
CodeMirror 6.x: 用于代码块编辑的专业代码编辑器
Pinia: 轻量级状态管理

3. 主题系统(急需帮助!)

现目前实现了一个基础的主题系统,但说实话,我的审美和设计能力真的不行😅:

深色/浅色模式: 支持深浅两种模式,可跟随系统自动切换
预设主题: 目前内置了几个主题,但配色和设计都比较粗糙
自定义主题: 支持创建和导入自定义主题
细粒度控制: 可独立调整界面字体、编辑器字体、字号、间距、圆角等
CSS 扩展: 支持加载外部 CSS 文件和自定义 CSS 代码

以上功能在更早的一个版本中已经实现了，但是我现在重构了主题插件，所以在完善实际可应用之前也想看看有没有更好的方案

比如更多的主题设置项、或者先确定出合理的配置区域、变量，再根据这些变量进行主题设计

以及主题每个配置项变更如何预览等

急需帮助: 主题编辑器的功能还不够完善,更重要的是,我的配色方案可能不太好看。如果你擅长 UI/UX 设计,或者对配色有研究,非常欢迎提供建议或直接参与主题设计!

4. AI 助手(基础功能)

我集成了 AI 对话功能,目前支持:

多模型支持: OpenAI、DeepSeek、Ollama 等
流式输出: 实时显示 AI 回复,体验流畅
上下文感知: 可以基于当前文档内容进行对话
Markdown 渲染: AI 回复内容支持 Markdown 格式化显示

其实以上功能还可以做更多扩展，但是目前每个插件或者功能我都基本做了个基础，等主程序彻底完善稳定后再进行打磨。

（还有一个就是服务能力提供问题，比如a插件可以依赖b插件，b插件向主程序注册某些服务能力，a插件可以调用）

5. 图片处理(基础功能)

实现了基本的图片处理功能:

多种上传方式:

Base64 编码(适合小图片)
本地文件复制(保持文件引用)
图床上传(支持七牛云、阿里云 OSS、腾讯云 COS、华为云 OBS、GitHub)

智能处理:

拖拽上传
粘贴上传
实时预览
上传进度显示
自动路径转换(支持相对路径和绝对路径)

6. 文档导出(基础功能)

目前支持将文档导出为:

PDF: 保留完整格式的专业文档
HTML: 可在浏览器中查看的网页
Markdown: 纯文本格式,便于分享
图片: 将文档渲染为图片(PNG/JPG)

更精细的功能暂未实现，还需要打磨

7. 编辑体验

基于 Milkdown 实现的编辑功能:

所见即所得: 实时渲染 Markdown
斜杠命令 : 输入 / 快速插入元素
代码高亮: 支持多种编程语言
数学公式: 支持 LaTeX 公式
表格编辑: 基础的表格编辑
任务列表: 待办事项列表
Mermaid 图表: 流程图、时序图等

注意: 编辑器功能还在持续完善中,可能存在一些 bug。

TODO: 编辑器界面截图

8. 布局系统

实现了基本的布局功能:

可调整侧边栏: 左右侧边栏可展开/收起/调整宽度
多标签页: 支持同时打开多个文档
文件树: 支持多根目录

不用担心布局太繁杂，都可以隐藏

9. 其他功能

自动保存: 实时保存编辑内容
文件关联: 双击 .md 文件自动打开暂时有 bug
快捷键: 基础的快捷键支持
多语言: 支持中文和英文
自动更新: 内置更新功能
大纲视图: 暂时有 bug

与 Milkup、Typora 对比

架构设计

特性	Summer	Milkup	Typora
技术栈	Tauri	Electron	原生/Electron
应用体积	小(~10MB)	中(~100MB)	中(~100MB)
跨平台	✅ Windows/macOS/Linux	✅ Windows/macOS/Linux	✅ Windows/macOS/Linux

开源与价格

特性	Summer	Milkup	Typora
开源	✅ MIT	✅ MIT	❌ 闭源
价格	免费	免费	付费($14.99)
社区支持	🌱 新项目	✅ 活跃	✅ 活跃

优势对比

Summer 的特点:

现代化架构: 基于 Tauri,体积小、性能好
插件化设计: 类似 VS Code 的架构,扩展性强
开源免费: MIT 协议,完全开源
持续开发: 功能还在快速迭代中
欢迎贡献: 个人项目,欢迎任何形式的参与

坦白说,Summer 目前在功能完善度和稳定性上还无法与 Typora 和 Milkup 相比。但我希望通过开源协作的方式,让它逐步成长起来。

适合谁使用

Summer 目前适合:

尝鲜者: 愿意尝试新项目,不介意偶尔遇到 bug
开发者: 对编辑器架构感兴趣,想参与开发
开源爱好者: 希望参与开源项目
轻量化追求者: 不想使用臃肿的 Electron 应用

如果你需要一个稳定可靠的生产力工具,建议还是使用 Typora 或 Milkup。

尝鲜体验

release

参与开发

如果你对 Summer 的开发感兴趣,可以:

查看代码: 项目采用 TypeScript,代码结构比较清晰
提交 PR: 欢迎修复 bug 或添加新功能
参考示例 : demo/plugins/ 目录下有一些插件示例（由于主程序的变更，demo中的代码可能已无法正常工作）

由于是个人开发,进度比较慢,非常欢迎有兴趣的朋友一起参与!

技术亮点

1. 插件运行时隔离

每个插件都有独立的 PluginRuntime 实例,提供了:

事件总线(EventBus)
编辑器管理(EditorManager)
设置管理(SettingsManager)
命令系统(CommandManager)
菜单系统(MenuAPI)
图标系统(IconAPI)
UI 工具(Toast, Dialog, Loading, Progress)

2. 共享依赖系统

通过 SharedDependencies 模块,主程序向插件提供:

Milkdown 核心库
CodeMirror 编辑器
ProseMirror 底层库

插件开发时只需在 vite.config.ts 中配置 external,即可使用这些共享依赖。

3. 生命周期管理

完善的生命周期钩子:

APP_READY: 应用启动完成
EDITOR_BEFORE_CREATE: 编辑器创建前
EDITOR_CREATED: 编辑器创建完成
EDITOR_READY: 编辑器就绪
APP_BEFORE_DESTROY: 应用销毁前
APP_DESTROYED: 应用已销毁

4. 响应式设置系统

基于 Vue 3 的响应式系统,设置变更会自动触发 UI 更新和持久化。

开发计划

由于是个人开发,进度会比较慢。以下是我的开发计划:

近期计划

完善主题系统(急需设计帮助!)
完善设置系统
欢迎提出更多TODO项

如果你有兴趣参与开发,可以认领其中的任务,或者提出新的功能建议。

开发状态与寻求帮助

Summer 目前处于早期开发阶段,很多功能还不完善,可能存在各种 bug。

关于插件开发

虽然我实现了插件系统的基础架构,但由于以下原因,暂时不建议开发第三方插件:

API 不稳定: 插件 API 还在快速变化,可能会有破坏性更新
文档缺失: 还没有时间写详细的插件开发文档
向后兼容: 无法保证当前版本的插件在未来能正常工作

我计划在 v1.0.0 版本正式开放插件开发,届时会提供稳定的 API 和完善的文档。

急需帮助的地方

作为个人开发者,我在以下方面确实力不从心,非常希望得到帮助:

1. UI/UX 设计(最急需!)

坦白说,我的审美真的不行😅:

配色方案: 现有的主题配色可能不太好看,需要专业的配色建议
图标设计: 图标风格不够统一,需要重新设计
布局优化: 界面布局可能不够合理,需要 UX 方面的建议
交互改进: 有些操作可能不够直观

如果你擅长设计,或者对配色有研究,非常欢迎提供建议或直接参与设计!

2. 功能开发

由于是个人开发,进度比较慢。如果你:

熟悉 TypeScript/Vue 3
对编辑器开发感兴趣
有时间参与开源项目

欢迎一起开发!可以从修复 bug 开始,或者认领一些功能开发任务。

3. 测试和反馈

遇到 bug 请及时反馈
有功能建议请提出来
使用体验不好的地方请告诉我

4. 文档和教程

帮助完善使用文档
编写教程或录制视频
翻译文档到其他语言

==== 更建议功能稳定后再进行文档补充

如何参与

Gitee Issues : 提交 bug 或建议
Gitee Discussions : 参与讨论
Pull Request: 直接提交代码
邮件: 1378511152@qq.com

不管是代码贡献、设计建议,还是简单的使用反馈,我都非常感谢!

结语

Summer 是一个年轻的项目,它的目标是成为一款现代化、可扩展、用户友好的 Markdown 编辑器。虽然目前还有很多不足,但我们相信,在社区的支持下,Summer 会越来越好。

如果你喜欢 Summer,欢迎:

⭐ 在 Gitee 上给项目点个 Star
🐛 报告 Bug 和提出建议
💡 贡献代码和文档
📢 向朋友推荐 Summer

让我们一起打造更好的 Markdown 编辑体验!

项目地址--点击跳转
许可证: MIT

邮件: 1378511152@qq.com

不管是代码贡献、设计建议,还是简单的使用反馈,我都非常感谢!

点击链接加入群聊编辑器兴趣交流