CKEditor 5: the best open source Markdown editor

mingong · May 8, 2022, 9:27am

首先注明: 标题是CKSource说的, 他们之前认为自家的CKEditor 5配得起the best open source Markdown editor;

其实CKEditor 5离这个目标还远着呢.

当初的标题为: A simple constrained-rich-text and markdown editor. Electron + TinyMCE.

是包含markdown的, 使用的markdown解析器为 GitHub - showdownjs/showdown: A bidirectional Markdown to HTML to Markdown converter written in Javascript, 个人觉得showdown还算不上优秀, 而且在wysiwyg 的app 里加上左markdown右预览的界面好像也不太合适, 就干脆删除了与markdown相关的部分.

至于像CKEditor 5这样简单粗暴的markdown解决方案, 个人也是鄙视的; 不过呢, CKEditor 5架子都建设好了, 剩下的事情就简单了; 嗯, 厚道不厚道, 是不是the best open source Markdown editor, 好像也不再重要了.

正文:

About

A simple constrained-rich-text editor. Electron + CKEditor.

A simple constrained-rich-text editor using Electron, and CKEditor 5. Runs on Windows, macOS, Linux, and Chrome OS (via Crostini).

Forked and expanded on from mingong/tiny-electron.

Open and save files as markdown (MD).
View to edit the document as rich-text.
Rich-text is constrained. Only headings, bold, italics, To-do lists, strikethrough, bulleted lists, numbered lists, links, block quotes, code, tables, images, and horizontal lines are included. All other styling( e.g. font size, font color, spacing, alignment, etc.) is automatically filtered.
Rich-text is displayed with a fixed appearance. Modifiable via stylesheet (or in preferences in the future).
Partial support for live conversion of markdown into rich-text in rich-text editing mode. For example, typing # Header title will make an H1 header and typing **This text is bold.** will give bolded text. This feature does not currently work for links, tables, or images (use the formatting buttons, or keyboard shorcuts instead for these). Also includes live conversions for en (–) and em dashes (—).
Editing and formatting keyboard shortcuts in rich-text mode (e.g., ctrl+o = open, ctrl+v = paste, ctrl+t = strikethrough, etc.).
Find and replace functionality in the rich-text view.

All the bugs! Editor is experimental and not for production use at this time. Markdown support is especially buggy.

To install dependencies and run:

npm install

npm start

To build executables:

yarn dist

To install as an application, run the appropriate executable (e.g., .exe, .deb) in the dist folder after building.