markdown的瑞士軍刀

兩分鐘提高vscode的markdown書寫體驗

對於程序員來說,時常溫故知新,寫博客是十分有益的,markdown成爲衆多程序員寫作的新寵,不僅簡潔,而且優雅,這裏推薦一些提高markdown書寫效率,並且美化排版的工具.

雖然說是兩分鐘,也可以30s解決啦,直接看下面.

文中插件

插件名 作用 測試版本
Markdown Theme Kit 支持自定義markdown預覽樣式 0.1.4
Markdown Preview Github Styling 以github風格預覽markdown 0.1.6
markdown-formatter 支持格式化和快捷輸入 0.4.0
Markdown+Math 支持LaTex數學公式 2.3.9

vscode Setting.json 推薦配置:

"[markdown]": {
  // 保存自動格式化
  "editor.formatOnSave": true,
  // 顯示空白字符
  "editor.renderWhitespace": "all",
  // 快速補全
  "editor.quickSuggestions": {
    "other": true,
    "comments": true,
    "strings": true
  },
  "editor.snippetSuggestions": "top",
  "editor.tabCompletion": "on",
  "editor.acceptSuggestionOnEnter": "on"
}

或者花點時間看這裏.

vscode插件推薦

原生支持

作爲一個代碼編輯器, 原生支持markdown顯示. 只需要 command(ctrl)+shift+p, 輸入 Markdown Priview to the side , 就可以預覽.

img

可以定製化的預覽樣式

可以自由地導入markdown展示樣式, 也可以通過 Markdown Theme Kit 這樣的插件來快速更改修改風格.
這裏推薦一款 Markdown Preview Github Styling 插件, 可以將預覽模式變成github的樣式

img

擁有快速格式化工具

推薦一下 markdown-formatter 插件, 可以快速格式化代碼.

例如這樣的內容

img

按一下command+shift+f 就可以快速格式化爲

img

是不是很方便?(標題並沒有被刪掉, 只是沒截下來)

支持快捷輸入

img

enter以後, 生成表格

img

也可以插入代碼

img

img

支持LaTex語法

安裝 Markdown+Math 插件, 就可以愉快預覽LaTex數學公式了, 此處 艾特 掘金官方, 他們的文檔也支持LaTex哦

這樣的代碼

$ f(x, y) = \frac{x^2}{y^3} $

在掘金裏

$$ f(x, y) = \frac{x^2}{y^3} $$

本地預覽截圖

img

更多功能

在Setting.json中可以進行更多設置來開啓更多功能

img

img

例如可以針對markdown設置保存自動格式化,顯示空白字符等等

"[markdown]": {
  // 保存自動格式化
  "editor.formatOnSave": true,
  // 顯示空白字符
  "editor.renderWhitespace": "all",
  // 快速補全
  "editor.quickSuggestions": {
    "other": true,
    "comments": true,
    "strings": true
  },
  "editor.snippetSuggestions": "top",
  "editor.tabCompletion": "on",
  "editor.acceptSuggestionOnEnter": "on"
}

好的, 本期節目到這裏就結束了, 喜歡的觀衆請點個關注, 並長按視頻下方的大拇指一鍵三連支持下up主.

拜託啦這對我真的很重要.

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章