這兩天臨近國慶，小編要寫的東西還蠻多，在編寫的閒暇想到一個有趣的問題，就是大家平時都使用什麼編寫工具？
這幾年似乎Markdown編輯器逐漸成為行業裡的主流，如果有還不了解的小夥伴，小編稍稍介紹一下。
Markdown編輯器，主要是可以使用一套格式標記語言來對文檔內容進行排版和格式顯示，而這種編輯器在程序猿圈子裡逐漸受到歡迎的原因是：
1、讀寫改方便，Markdown的格式標記語法簡單，常用的標記只有十多個，相對來說非常輕量，上手很快，只需要學習幾個簡單的符號，然後就可以專注於碼字了，而不需要手動設置各種樣式。
2、一器多用，Markdown即可以用來編寫說明文檔並且在主流平臺都通用，又可以寫技術文章，寫出來的內容中可以清晰的區分說明部分和代碼。
3、輸出方便，Markdown的文章可以輕鬆的轉換為html、pdf等多種不同方式。
目前國內有各種各樣不同的Markdown編輯器，其中比較有名的就像Typora。
小編目前用的最多也是Typora。Typora的設計理念就是追求最極致的簡潔，讓你在編寫的同時就可以看到預覽的結果，但美中不足的是Typora是一款獨立的軟體，並沒有開源，很多小夥伴都想了解下，一款Markdown編輯器到底是怎麼實現的？也有很多小夥伴想如何能讓編輯器裡面加一下自己想要的定製化功能呢？
所以小編今天帶來的就是一款風格同樣追求簡潔、集合了Markdown編輯器、組件化定製、插件引用於一身的開源項目。
Milkdown
就像名字中的milk一樣，整個編輯器就像牛奶一樣柔順可口，看著舒服。
和其他主流的Markdown編輯器不一樣的是，Milkdown將自己的功能組件化、模塊化，所以對於用戶來說，可以選擇自己需要的功能模塊，以插件的形式引用，這樣一方面可以減少不必要的資源的浪費，用戶不需要為了一個功能安裝其餘一些不需要的功能，同時也方便滿足個性化的定製需求，自己有什麼訴求只需要編寫一個獨立的NPM功能模塊包，然後通過NPM安裝就可以了。
Milkdown的功能特性主要有：
主要運用的技術及對應官網包括：
Prosemirror，用來在web端構建編輯器本身，可以參考https://prosemirror.net/Remark，用於作為markdown的解析器，可以參考https://github.com/remarkjs/remarkTypeScript，編寫語法，https://www.typescriptlang.org/Emotion，用於構建樣式，https://emotion.sh/Prism，代碼塊的支持，https://prismjs.com/Katex，渲染用，https://katex.org/目前Milkdown提供直接在線使用功能，我們可以在其中任意的使用、體驗。
例如像表格，在Milkdown中，只需要通過輸入 || 和一個空格，就可以完成。
打兩個 ||
再打一個空格
點擊表格左上角，可以對表格進行行列操作
同時可以支持左右屏分別顯示源碼和效果，方便比對，查看源碼進行修改。
其他的功能小夥伴們可以自行嘗試，應該可以滿足大多數人的一般需要。
如果有什麼額外想實現的功能，記得Milkdown是插件式的工具，除了自己直接編寫插件，我們也可以先去官方插件庫查找一下，看看是否已經有前人完成了我們的構思。
目前官方給出的插件有：
名稱描述@milkdown/preset-commonmark添加commonmark語法支持@milkdown/preset-gfm添加gfm語法支持@milkdown/plugin-history添加撤銷和重做支持@milkdown/plugin-clipboard添加 markdown 格式的複製粘貼能力@milkdown/plugin-cursor添加 drop 和 gap 光標@milkdown/plugin-listener添加監聽器支持@milkdown/plugin-collaborative添加協同編輯支持@milkdown/plugin-table添加表格語法支持（已經包含在 gfm 中）@milkdown/plugin-prism添加 prism用於支持代碼塊高亮@milkdown/plugin-math添加 LaTeX用於支持數學公式@milkdown/plugin-tooltip添加選擇工具條@milkdown/plugin-slash添加斜線指令@milkdown/plugin-emoji添加表情符號支持同時官方還提供社區，讓用戶們可以自由地交流分享自己的插件，不過下載別人的插件需謹慎哦。
當然大家最關心的可能還是如何自己編寫插件，其實不難，大多數插件的格式都是這樣的：
import { MilkdownPlugin } from '@milkdown/core';
const myPlugin: MilkdownPlugin = (pre) => {
// #1 準備階段
return async (ctx) => {
// #2 執行階段
};
};
主要由兩部分組成，準備階段和執行階段。
準備階段的內容就是將插件被通過use時，註冊進milkdown，然後執行階段就是在插件被真實加載時執行的內容。
說那麼多不如自己上手練一練，想自己開發插件自給自足的小夥伴，或者喜歡這個風格想直接試用的小夥伴，趕緊一起來試試這個開源的Markdown編輯器吧：
點擊下方卡片，關注公眾號「TJ君」
回復「milk」，獲取倉庫地址