Mac Sublime Markdown 插件 實時預(yù)覽

本文環(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

功能

  1. 支持在瀏覽器中預(yù)覽markdown文件
  2. 將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ù)覽盖腿,美滋滋。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末损同,一起剝皮案震驚了整個濱河市翩腐,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌膏燃,老刑警劉巖茂卦,帶你破解...
    沈念sama閱讀 217,657評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異组哩,居然都是意外死亡疙筹,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評論 3 394
  • 文/潘曉璐 我一進店門禁炒,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人霍比,你說我怎么就攤上這事幕袱。” “怎么了悠瞬?”我有些...
    開封第一講書人閱讀 164,057評論 0 354
  • 文/不壞的土叔 我叫張陵们豌,是天一觀的道長涯捻。 經(jīng)常有香客問我,道長望迎,這世上最難降的妖魔是什么障癌? 我笑而不...
    開封第一講書人閱讀 58,509評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮辩尊,結(jié)果婚禮上涛浙,老公的妹妹穿的比我還像新娘。我一直安慰自己摄欲,他們只是感情好轿亮,可當(dāng)我...
    茶點故事閱讀 67,562評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著胸墙,像睡著了一般我注。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上迟隅,一...
    開封第一講書人閱讀 51,443評論 1 302
  • 那天但骨,我揣著相機與錄音,去河邊找鬼智袭。 笑死奔缠,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的补履。 我是一名探鬼主播添坊,決...
    沈念sama閱讀 40,251評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼箫锤!你這毒婦竟也來了贬蛙?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,129評論 0 276
  • 序言:老撾萬榮一對情侶失蹤谚攒,失蹤者是張志新(化名)和其女友劉穎阳准,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體馏臭,經(jīng)...
    沈念sama閱讀 45,561評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡野蝇,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,779評論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了括儒。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片绕沈。...
    茶點故事閱讀 39,902評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖帮寻,靈堂內(nèi)的尸體忽然破棺而出乍狐,到底是詐尸還是另有隱情,我是刑警寧澤固逗,帶...
    沈念sama閱讀 35,621評論 5 345
  • 正文 年R本政府宣布浅蚪,位于F島的核電站藕帜,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏惜傲。R本人自食惡果不足惜洽故,卻給世界環(huán)境...
    茶點故事閱讀 41,220評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望盗誊。 院中可真熱鬧时甚,春花似錦、人聲如沸浊伙。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽嚣鄙。三九已至吻贿,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間哑子,已是汗流浹背舅列。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留卧蜓,地道東北人帐要。 一個月前我還...
    沈念sama閱讀 48,025評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像弥奸,于是被迫代替她去往敵國和親榨惠。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,843評論 2 354

推薦閱讀更多精彩內(nèi)容