使用Atom打造無懈可擊的Markdown編輯器

一直以來都奢想擁有一款全能好用的Markdown編輯器,直到遇到了Atom。廢話很少說,直接開搞!html

1. 安裝Atom

下載安裝Atom:https://atom.io/
node

2. 加強預覽(markdown-preview-plus)

Atom自帶的Markdown預覽插件markdown-preview功能比較簡單,markdown-preview-plus對其作了功能擴展和加強。macos

  1. 支持預覽實時渲染。(Ctrl + Shift + M)
  2. 支持Latex公式。(Ctrl + Shift + X)

使用該插件前,須要先禁用markdown-preview。
markdown

查看實時渲染和公式編輯功能。
網絡

3. 同步滾動(markdown-scroll-sync)

同步滾動是Markdown編輯器的必備功能,方便翻閱文檔修改時能快速定位到預覽的位置。編輯器

markdown-scroll-sync不只支持同步滾動,在光標位置發生變動時也會同步滾動,這個功能在不少Markdown編輯器中不具有。工具

4. 代碼加強(language-markdown)

通常的Markdown編輯器提供了代碼着色等基本功能,language-markdown除了能給代碼着色,還提供了快捷的代碼片斷生成等功能。ui

5. 圖片粘貼(markdown-image-paste)

圖片功能支持的好壞直接決定了我是否選擇使用一個Markdown編輯器。也有很多編輯器和在線的圖牀綁定,可是這種方式受限於網絡。雖然Markdown支持插入本地圖片,可是每次插入新圖片都是一堆重複操做:截圖-命名-保存-插入。markdown-image-paste將這些操做一步完成:atom

  1. 使用截圖工具將圖片複製到系統剪切板。
  2. 在Markdown新起一行輸入文件名。
  3. Ctrl + V 會自動把圖片保存到Markdown文件相同目錄下(所以要求Markdown文件應該先保存),並命名爲剛輸入的文件名,同時在剛纔輸入文件名行處生成img標籤。

固然,若是想插入gif動圖就不能這麼簡單了,仍是老老實實地下載這個工具手工插入吧。插件

LICEcap: http://www.cockos.com/licecap/

6. 表格編輯(markdown-table-editor)

一直對Markdown的table語法很無愛,直到遇到了markdown-table-editor,這操做效率簡直炸了!文字已經不能表達個人激動之情了,直接看圖吧。

7. pdf導出(markdown-themeable-pdf、pdf-view)

很多Markdown編輯器都會提供pdf導出功能,甚至將其做爲收費功能。而Atom的markdown-themeable-pdf、pdf-view插件能夠輕鬆實現pdf導出和預覽功能。

安裝markdown-themeable-pdf時遇到了一些坑,在此分享一下:

因爲GFW的問題,致使該插件使用的phantomjs模塊沒法安裝成功,從而導出pdf報告錯誤。

解決辦法是:

  1. 從官網下載phantomjs二進制安裝包:http://phantomjs.org/download.html
  2. 解壓下載的phantomjs-2.1.1-macosx.zip壓縮文件。
  3. 添加index.js文件到解壓後的目錄。
  4. 將整個目錄的內容拷貝到:~/.atom/packages/markdown-themeable-pdf/node_modules/phantomjs-prebuilt,注意目錄phantomjs-2.1.1-macosx被重命名爲phantomjs-prebuilt
  5. 重啓Atom,右鍵->Markdown to PDF便可,生成的pdf文件在Markdown文件同目錄。

其中index.js文件內容爲:

module.exports = {
  path : __dirname + '/bin/phantomjs'
}

8. 總結

以上介紹的Atom的Markdown插件,基本上知足了我對一個Markdown編輯器的全部幻想,實時渲染、同步滾動,公式、代碼、圖片、表格的快捷操做與支持,以及pdf文件導出、預覽等。但願此文對你有所幫助。

相關文章
相關標籤/搜索