Skip to content

Repository files navigation

Sleephat Editor

logo

轻量级所见即所得(WYSIWYG)Markdown 编辑器,基于 Tauri 2 + Vditor 构建,跨平台(Windows / Linux / NixOS)。

灵感来源:zaaack/vscode-markdown-editor

特性

核心编辑

  • 三种编辑模式:所见即所得(WYSIWYG)/ 即时渲染(IR,默认)/ 分屏
  • 完整工具栏:标题、加粗、斜体、删除线、链接、列表、任务列表、引用、代码块、行内代码、表格、表情、分割线、撤销/重做、大纲、代码主题/内容主题
  • KaTeX 数学公式Mermaid 流程图(经 Vditor 渲染)
  • 编辑器内查找栏Ctrl+F / Cmd+F):CSS Highlight 高亮,区分大小写、上/下条切换、计数显示
  • 行号 gutter(工具栏 # 切换):按 Markdown 块显示起始行,随内容实时更新
  • 复制 Markdown / 复制 HTML 到剪贴板

文件与自动保存

  • 打开 / 新建 / 保存 / 另存为(Ctrl+O / Ctrl+N / Ctrl+S
  • 自动保存(300ms 防抖),不清 dirty 标记;外部修改检测:切回窗口时按 mtime 对比提示重载
  • 关闭确认三态:保存并关闭 / 不保存 / 取消关闭;保存失败会中止关闭,防止丢数据
  • 拖拽打开 .md 文件
  • 命令行打开sleephat-editor path/to/file.md
  • 最近文件列表(最多 10 条,随打开自动维护)

图片与媒体

  • 粘贴 / 拖拽图片上传,自动保存到 <文档目录>/assets/(目录可配置,见下)
  • 相对路径图片/音视频即时预览:自定义 vmd-asset:// 协议按文档目录解析,图片不再 404
  • 上传安全:扩展名白名单、单文件 20MB 上限、文件名净化(防路径穿越)、目录拒绝绝对路径/../

主题与个性化

  • 深浅色主题:默认跟随系统,也可在欢迎页手动覆盖(记住选择)
  • 自定义 CSS:config.json 的 custom_css 字段注入 <style>,自由调整渲染样式
  • 滚动位置持久化:按文件路径记录阅读位置,关闭重开后恢复

安全(P0–P3 审查修复)

  • CSP 内容安全策略 + 发布版关闭 devtools
  • 链接拦截:拒绝 javascript: / data: / file: 等 scheme、执行型扩展名(.exe .bat 等)、相对链接限定文档目录内(防 ../ 越界)
  • 配置保存读-改-写合并,不再整体覆盖清空 recent_files
  • 配置损坏自动备份config.json.bak 再回落默认
  • Tauri capabilities 权限收敛core:default + dialog:default + dialog:allow-ask

截图

待补充:

  • 编辑器主界面(即时渲染模式 + 行号 + 工具栏)
  • 查找栏
  • 深色主题
  • 图片相对路径预览

技术栈

技术
桌面壳 Tauri 2(Rust),插件 plugin-dialogplugin-opener
编辑器内核 Vditor 3.x
前端 TypeScript + Vite 4,@tauri-apps/api
其他 date-fns、lodash

开发构建

通用步骤

npm install
npm run typecheck      # 类型检查,应 0 错
npm run tauri dev      # 开发模式
npm run tauri build    # 发布构建(Linux 默认产出 .deb,配置见 src-tauri/tauri.conf.json)

国内镜像源:仓库自带 .npmrc(npmmirror)与 src-tauri/.cargo/config.toml(rsproxy sparse index),在国内网络下加速 npm / crates.io 下载。非国内网络环境可删除这两个文件以走官方源。

Windows

npm install
npm run tauri dev

需要 Rust 工具链(rustup)与 VS Build Tools(MSVC)。

Linux(Debian/Ubuntu)

sudo apt install libwebkit2gtk-4.1-dev libgtk-3-dev \
  librsvg2-dev libayatana-appindicator3-dev \
  rustc cargo nodejs npm

Linux(Fedora)

sudo dnf install rust cargo nodejs npm \
  webkitgtk4.1-devel gtk3-devel

NixOS

仓库提供 shell.nix(开发环境)与 default.nix(把预编译产物包成 Nix 派生式)。

nix-shell          # 进入开发环境(自动配置 PKG_CONFIG_PATH / SSL_CERT_FILE)
npm install
npm run tauri dev

shell.nix 已内置构建 Tauri 所需的系统依赖(webkitgtk_4_1gtk3librsvglibappindicator-gtk3opensslgstreamer 全家桶),并清空代理环境变量(防止 WebView 经代理访问 localhost 白屏 / 502)。

打包成品(先 npm run tauri build 再用 default.nix 包装):

npm run tauri build
nix-build default.nix

注意:default.nix 是「包装」而非「从源码构建」——它直接拷贝 src-tauri/target/release/markdown-editor 并加上 GApp 包装参数,需先完成普通构建。

配置说明(config.json)

配置文件位置:

  • Windows%APPDATA%\com.sleephat.editor\config.json
  • Linux / NixOS~/.config/com.sleephat.editor/config.json
字段 类型 说明
vditor_options object Vditor 初始化选项(主题、预览配置),编辑器内切换会自动保存
recent_files string[] 最近打开文件列表(最多 10 条),自动维护
window_width / window_height / window_x / window_y number 窗口几何
welcome_dark boolean 主题手动覆盖:true=深色,false=浅色;缺省时跟随系统深浅色
custom_css string 自定义 CSS 原文,启动时注入 <style>
image_save_folder string 图片保存目录(相对文档目录,默认 assets;拒绝绝对路径与 ../ 穿越)

示例:

{
  "vditor_options": { "theme": "dark" },
  "recent_files": ["C:\\notes\\test.md"],
  "welcome_dark": true,
  "custom_css": ".vditor-reset { line-height: 1.8 !important; }",
  "image_save_folder": "img"
}

测试指引

完整的手动测试方案见 TEST_PLAN.md,覆盖:

  • P0:关闭三态、图片上传路径安全、链接安全、主题切换不丢最近文件
  • P1:重置配置、表格多表/空单元格定位、对话框不卡 UI、另存后不误报外部修改
  • P2:表格对齐保留、IPC 节流、查找栏、上传异常、新建文件基准
  • P3:控制台干净、连续点击不吞、打开后立即输入、语言、坏配置备份
  • P4:图片相对路径预览、滚动位置持久化、行号、主题联动、customCss、imageSaveFolder

快速开始:

npm run typecheck          # 0 错
npm run tauri dev -- -- test.md   # 用测试文档打开,验证链接/查找栏/表格

仓库根目录的 test.mdsub.md 是现成的链接/查找栏验证样本。

已知限制

  1. 音/视频大文件vmd-asset:// 协议未实现 HTTP Range,长视频可能缓冲慢;图片完全不受影响。
  2. 自定义协议路由:相对路径预览依赖 Tauri 运行时的协议注册,WebView2 / WebKitGTK 各平台需实测确认。
  3. 滚动位置持久化:以文件绝对路径为 localStorage key,重命名/移动文件后旧位置失效(正常现象)。
  4. 主题联动语义content-theme 工具栏的手动选择仅当前会话有效;重启后若无 welcome_dark 设置则跟随系统主题。
  5. 配置无 UI 入口custom_css / image_save_folder 目前只能手动编辑 config.json。
  6. 实测程度:项目已完成一轮代码级审查修复与类型检查(tsc --noEmit 0 错),但尚未大规模实机测试,部分边界场景(超大文档搜索、表格多表定位、自定义协议路由)可能在真实使用中暴露问题。

致谢

许可证

MIT

About

Sleephat — WYSIWYG Markdown Editor

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages