本文環(huán)境
操作系統(tǒng):maxOS 10.15.6
參考:
Sublime Text3 的 Markdown 實時預(yù)覽全面總結(jié)
用sublime 看md文件不舒服潮饱,沒有網(wǎng)頁或者預(yù)覽看的舒服铅碍,以下
MarkdownPreview + LiveReload
解決了這個問題桅狠。
非常感謝參考作者,感謝sublime強大的插件功能冀膝!
插件安裝方式
組合鍵Command+Shift+P 調(diào)出命令面板
輸入Package Control: Install Package,回車
在搜索框中輸入要安裝的包名(一個一個刚梭,不能同時安多個)
靜待幾秒即可安裝成功
插件介紹
介紹幾個Markdown類的常用插件:
插件 | 功能 |
---|---|
MarkdownEditing | 一個提高Sublime中Markdown編輯特性的插件 |
MarkdownPreview | Markdown轉(zhuǎn)HTML重慢,提供在瀏覽器中的預(yù)覽功能 |
MarkdownLivePreview | 提供在編輯框中實時預(yù)覽的功能 |
LiveReload | 一個提供md/html等文檔的實時刷新預(yù)覽的的插件 |
1. MarkdownEditing
顧名思義,Markdown編輯器,是Markdown寫作者必備的插件茅信,不僅可以高亮顯示Markdown語法還支持很多編程語言的語法高亮顯示盾舌。
特別注意:MarkdownEditing只針對 md\mdown\mmd\txt 格式文件才啟用。
特性
MarkdownEditing 從視覺和便捷性上針對 Markdown 文檔的編輯進行了一系列的優(yōu)化蘸鲸。如:
顏色方案仿 Byword及iA writer
自動匹配星號(*)妖谴、下劃線(_)及反引號(`)
選中文本按下以上符號能自動在所選文本前后添加配對的符號
方便粗體、斜體和代碼框的輸入
效果圖:
2. MarkdownLivePreview
功能
實時預(yù)覽Markdown文件酌摇,左側(cè)為md文件膝舅,右側(cè)為預(yù)覽結(jié)果∫ざ啵可配合MarkdownEditing一起使用仍稀。
使用
MarkdownLivePreview默認(rèn)關(guān)閉實時預(yù)覽,既然安裝這個插件了怯伊,那肯定是要用的琳轿。打開方式為在Preferences -> Package Settings -> MarkdownLivePreview -> Settings 的設(shè)置的右側(cè)加一條 "markdown_live_preview_on_open": true,,重啟sublime即可耿芹。
為什么不能直接將左側(cè)對應(yīng)的false改為true崭篡,這是因為左側(cè)為默認(rèn)配置,是不能改的(只讀)吧秕,右側(cè)的編輯區(qū)才是用戶自定義區(qū)琉闪。
我沒有裝成功
但是可以啟動MarkdownLivePreview
3. MarkdownPreview
功能
- 支持在瀏覽器中預(yù)覽markdown文件
- 將md文件導(dǎo)出為html代碼
將md文件用瀏覽器預(yù)覽——1.常規(guī)方法
- 組合鍵 Command+Shift+P 調(diào)出命令面板
- 輸入mdp找到并選中Markdown Preview: Preview in Browser
- 出現(xiàn)兩個選項:github和markdown。任選其一即可砸彬,github是利用GitHub的在線API來解析.md文件颠毙,支持在線資源的預(yù)覽,如在線圖片它的解析速度取決于你的聯(lián)網(wǎng)速度砂碉。該方式據(jù)說一天只能打開60次蛀蜜。markdown就是傳統(tǒng)的本地打開,不支持在線資源的預(yù)覽增蹭。
- 默認(rèn)瀏覽器中顯示預(yù)覽結(jié)果
將md文件用瀏覽器預(yù)覽——2.用快捷鍵打開
Sublime Text支持自定義快捷鍵滴某,Markdown Preview默認(rèn)沒有快捷鍵,我們可以自己為Markdown Preview: Preview in Browser設(shè)置快捷鍵滋迈。
方法是在Preferences -> Key Bindings打開的文件的右側(cè)欄的中括號中添加一行代碼:
{ "keys": ["commond+m"], "command": "markdown_preview", "args": {"target": "browser", "parser":"markdown"} }
這里:
"commond+m" 可設(shè)置為自己喜歡的按鍵霎奢。
"parser": "markdown"也可設(shè)置為"parser":"github",改為使用Github在線API解析markdown饼灿。
以上兩種方式都有個問題:每次預(yù)覽都要打開一個新的網(wǎng)頁幕侠,而且需要手動操作。有沒有一個方法碍彭,可以打開一個網(wǎng)頁后晤硕,之后再也不用管悼潭,讓它實時刷新預(yù)覽呢?
有窗骑,還很簡單女责,答案就是MarkdownPreview+LiveReload!
LiveReload是一個可實時刷新的插件创译,不僅可用于Markdown抵知,也可用于HTML等。
4. (最強)實時自動刷新預(yù)覽:MarkdownPreview + LiveReload
先安裝并配置Markdown Preview
如前Markdown Preview安裝成功后软族,設(shè)置前文所述的快捷鍵(如需)刷喜,打開其配置文件Preferences -> Package Settings -> Markdown Preview -> Settings
,檢查左側(cè)enable_autoreload
條目是否為true立砸,若是掖疮,跳過。若不是颗祝,右側(cè)欄加一條下面這個后重啟Sublime:
{
"enable_autoreload": true
}
安裝并配置LiveReload
Ctrl+Shift+p, 輸入 Install Package浊闪,輸入LiveReload, 回車安裝
安裝成功后, 再次Ctrl+shift+p, 輸入LiveReload: Enable/disable plug-ins, 回車, 選擇 Simple Reload with delay (400ms)或者Simple Reload,兩者的區(qū)別僅僅在于后者沒有延遲螺戳。
開始使用
如前面提到的手動或者快捷鍵打開預(yù)覽網(wǎng)頁搁宾,之后便再也不用管它,只要你的sublime保存一次倔幼,網(wǎng)頁那邊就會自動刷新預(yù)覽盖腿,美滋滋。