效果(Gif)
倉庫地址
背景
在程序員的世界里,只要習慣用 Git,寫文章必然就是 Markdown 了。
近來幾天,重新玩起了微信公眾號,最不能忍受的就是那個編輯器,效率很低。雖然微信現在已經提供了模板功能,但是對於喜歡多平台發文的程序員來講,維護多個內容成本過高。
現狀
了解了目前市場上主流的編輯器:
結論是:都不是我想要的。
這幾個編輯器都是偏向推廣玩法的類型,過於花俏。好一點的模板也基本都是收費的,所以只能放棄。
轉變
經過 Google 幾下,發現微信編輯器是可以直接復制 HTML 代碼塊,這就給我們提供了更多可能。
既然常規主流的玩法無法滿足需求,那我就換了一個思路:繼續 Markdown 書寫,然后借用轉換器轉換
我開始換關鍵字搜索:React markdown 組件
運氣
在搜索的過程中我偶然遇到了:markdown-nice
簡介
支持自定義樣式的 Markdown 編輯器
支持微信公眾號排版
支持知乎、稀土掘金、博客園和CSDN等一系列平台
內容和自定義樣式瀏覽器中實時保存
可在工具中提交自定義主題
支持上傳圖片、腳注、公式
因為用了 antd,所以看起來非常簡潔,但是也因此非常龐大,但是這一點能接受。
需求
研究了作者提供了幾個主題,發現彼此審美上有偏差,自己實在忍受不了,所以就 fork 了一份,開始大面積調整。
添加了一個 CDK8S 主題
調整默認主題為 CDK8S
調整默認配色為 atomOneLight
添加開關 `IS_STYLE_READ_CACHE_OPEN` 默認主題從 localstorage 讀取
修改圖床上傳接口,改為私有服務的 API
去掉第一次加載彈出的更新彈窗
因為 CDK8S 這個關鍵字是唯一的,所以大家可以參考我的方式,自己定制自己的需求。
感謝
- 感謝 zhning12 童鞋
- 感謝 markdown-nice