Tauri + Monaco Editor 写一个vscode风格的EPUB编辑器（一） Ebook Code介绍

前言

目前最主流的EPUB电子书制作软件是Sigil，它免费、开源、支持多平台、支持各种插件，就各方面来说，它都无可挑剔，但唯独有个缺点——不支持代码提示和代码补全。

因此我就萌生了一个想法——写一个支持代码提示的EPUB编辑器，代码编辑器使用Monaco Editor，UI仿照VS Code的风格，所以取名Ebook Code，简称ebcode，taiyuuki/eb-code (github.com)。

话说回来，Sigil是支持用外部编辑器编辑文件的，所以，其实这个缺点严格来说并不算严重。

另外顺便一提，热门EPUB阅读器Calibre也内置了编辑EPUB的模块，但它同样不支持代码补全，至于其他一些杂七杂八的EPUB制作软件，别说代码补全了，有的甚至连代码界面都没有。

目前该编辑器的最核心功能已经基本完成，我打算写一系列文章，简要记录一下我的开发过程，大概包括以下这些内容：

• Ebook Code介绍
• Monaco Editor相关
  • 基本使用
  • 设置代码高亮、主题
  • 配置emmet，代码补全和提示
  • 汉化monaco-editor
  • html和xhtml的closing tag问题
• EPUB文件相关
  • epub文件的目录结构
  • epub2和epub3的区别
  • 解析epub文件的过程
  • xml的序列化和反序列化问题
  • xml命名空间问题
• EPUB编辑器的整体工作逻辑
• EPUB的实时预览
• 使用warp快速创建静态文件服务器
• 使用grep实现文件内容的搜索、替换

以上算是个大纲，最终我会写几篇文章，可能要视情况而定。

本文就是第一篇，主要是介绍一下本项目以及目前已经实现的功能。

项目搭建

本项目使用tauri v2、vue 3、quasar v2、monaco-editor开发，具体可以查看我的初始项目模板：tauri-quasar。

至于其他库或框架，我会在后续文章中进一步介绍，这里就暂且保留。

目前已经实现的功能

首先是颜色主题，一共内置了40多种主题，这些主题都来自shiki。

支持创建ePub 2和ePuB 3两个版本的EPUB文档，二者的区别我会在后面的文章中讲解。

编辑元数据

封面设置

目录设置

全书内容搜索、替换，支持正则表达式。

单文件搜索是Monaco Editor内置的功能

EPUB内置图片查看

TODO

随便列了一些，其实就是参考的Sigil。但说实话，我不一定有能力、有精力去把它们一一实现…

• 多文件批量处理
• 支持插件
• 多行搜索
• 字体子集化
• 文件分割
• 代码片段
• 自定义主题颜色
• 自动检测更新