前幾天說要自己開發(fā)一款markdown編輯器，功能層面要保持typora的簡潔和優(yōu)雅，功能方面要實(shí)現(xiàn)markdown編輯、預(yù)覽，同時還要支持主題的自定義，上次給各位小可愛展示了預(yù)覽markdown的效果，今天我們也算取得了階段性進(jìn)展：已經(jīng)可以完美實(shí)現(xiàn)markdwon文檔的編輯和保存，階段效果我也比較滿意，所以今天再和各位小伙伴同步下：

由于最近一直在搞這個markdown編輯器，公眾號也沒顧不上更新新內(nèi)容了，所以想著盡快搞出一個deta版本，然后慢慢更新。

其實(shí)過去這幾天，我是一直在搜集各類關(guān)于markdown的開源項(xiàng)目，看能否可以從中找到可以借鑒的點(diǎn)，但是實(shí)際情況真的是一言難盡，感覺比我搞java還累（可能是前端這塊比較雜，而且很多開源項(xiàng)目文檔不夠翔實(shí)，當(dāng)然也可能是我的接口），我搜集了如下項(xiàng)目：

vue-markdown

本來打算以此作為最終的編輯器實(shí)現(xiàn)的，但是經(jīng)過幾天的研究，發(fā)下這玩意不好搞，由于它本身就是左右分屏的markdown編輯器，所以最后只好放棄了。

marked：

marked屬于比較老牌的markdown解析工具，目前市面上很多markdown編輯器都是基于他進(jìn)行開發(fā)的，在markdwon解析方面還是很強(qiáng)的，新版本號稱速度 比C語言寫的Markdown轉(zhuǎn)換工具Discount 還要快。我最開始的markdown預(yù)覽就是基于它實(shí)現(xiàn)的，用它來做markdown博客解析應(yīng)該不錯。

highlightjs

``highlightjs是一款代碼高亮的插件，通常不會單獨(dú)使用，比如marked`中就可以集成它，我們之前的代碼高亮就是通過它來實(shí)現(xiàn)的。

jquery-note

一款輕量級的編輯器，原本是打算將他作為我的markdown編輯器的，但是發(fā)現(xiàn)用它實(shí)現(xiàn)的話，難度巨大，遂放棄。

codemirror：

大名鼎鼎的前端代碼編輯器，很多IDE工具都集成了他，比如IDEA，typora編輯器在編輯markdown源碼時，也用的它，當(dāng)時我用它實(shí)現(xiàn)了markdown的源碼編輯，但是考慮到反向解析不好做，最后也放棄了，有考慮做在線編輯器的小伙伴可以了解下：

turndown

turndown是和marked正相反的工具，它是一個將html轉(zhuǎn)為markdown的工具，原本打算將它和marked組合成使用的，但是考慮到更精細(xì)的操作和解析，最后也放棄了。

vditor

一款所見即所得編輯器，支持 Markdown。有三種解析方式，所見即所得、即時渲染和分屏預(yù)覽，即時渲染和typora很類似，最終我的編輯器方案就選了這個，但是要吐槽的是，項(xiàng)目文檔寫的太差，我研究了好幾天才寫出demo，而且接口不夠靈活，很多接口沒有對外暴露。

但是有這么一個開源項(xiàng)目已經(jīng)是謝天謝地了，畢竟即時預(yù)覽的markdown編輯器太難得了。

這個開源項(xiàng)目是國內(nèi)一家叫鏈滴的公司開源的，他們公司有一款markdown產(chǎn)品——思源筆記，有興趣的小伙伴可以去下載看看。

可能因?yàn)檫@個開源項(xiàng)目脫胎于公司的產(chǎn)品，所以我覺得在使用上感覺過于臃腫，而且接口文檔確實(shí)寫的太差了。

工具安利

最后再安利兩款及時渲染的markdown編輯器，畢竟typora開始收費(fèi)了，白嫖的小伙伴該找新的出路了。

Mark Text

mark text是一款開源的markdown編輯器，號稱永遠(yuǎn)開源，界面也很簡潔，可能是用慣了typora這樣的markdown編輯器，我覺得還是差點(diǎn)感覺，而且軟件啟動很慢：

下載地址：

https://marktext.app/

官網(wǎng)也很簡潔：

思源筆記

也就是我上面說的鏈滴的產(chǎn)品，這款軟件對我來說有點(diǎn)臃腫，感覺有點(diǎn)像notion，而且創(chuàng)建的文檔并不是原生的markdown（不過提供了導(dǎo)出功能）

我還是比較追求輕量級的markdown編輯器，喜歡那種沉浸式的感覺，所以我覺得思源筆記并不適合我。

下載地址：

https://b3log.org/siyuan/

好了，今天的內(nèi)容就先到這里，如果有小伙伴對這款正在開發(fā)中的編輯器感興趣，可以先去github了解下，

項(xiàng)目地址：

https://github.com/Syske/syskedown

最后我放上試用視頻：