前情介紹

小編使用的是mac筆記本，由于職業的關系需要編寫很多技術文檔和技術方案，本人喜歡用vscode編輯器利的插件來寫markdown文章，本文介紹的是如何通過使用vscode來編寫圖文并茂的公眾號文章(圖文并茂、排版工整是我的目標，真心不想花時間在花哨的排版上)

準備工作

vscode安裝和使用

• 下載地址 https://code.visualstudio.com/
• vscode的使用技巧學習 https://www.jianshu.com/p/61db92e209e1
• markdown插件安裝
  • Shift + command + P
  • 輸入 Extension 選擇插件安裝
  • 輸入markdown關鍵字
• 安裝markdown插件
  • 我安裝了如下圖中四個插件后能很好的實現公眾號編寫 其中第二個Markdown 是七牛云提供的圖床服務插件，能夠通過快捷鍵將剪切板的圖盤上傳成圖片地址，下面會詳細講解如何設置七牛云的markdown圖床設置方法

• 安裝好插件之后配合 Shift + command + P 快捷鍵和常規的markdown語法可以快速的編寫公眾號文檔

Markdown 七牛云圖床設置

• https://www.qiniu.com/ 注冊并且實名驗證后贈送10G的OSS圖片存儲空間，覺得能夠滿足絕大部分個人用戶的需求
• https://portal.qiniu.com/create 進入個人中心>密鑰管理
• 復制AccessKey/SecretKey備用
• 進入vscode Markdown插件設置頁面

• 點擊插件的設置圖標(如下圖所示)

• 設置相關參數
  • AccessKey 注冊之后新建密鑰對會有相關參數值 復制過來即可
  • Bucket 為了方便管理建立圖片管理的文件夾的概念，你可以新建一個 ‘gongzhonghao’的目錄專門用來放公眾號的文章
  • Domain 注冊后七牛云會分配一個免費的域名給你 復制過來設置到Domain項 域名最后的 / 不需要，免的踩坑
  • Is Save Local 選中即可在本地的./img文件夾也保持一份文件 方便你做第三方的遷移
  • Remote Path 設置成 ${Bucket}/${filename}{Bucket}//{fileName}
  • 詳情見下圖設置

• 設置好驗證
  • 使用QQ快捷鍵截屏一個圖片或者baidu一個圖片右鍵復制圖片
  • 蘋果使用 option + command + v
  • window使用 ctrl + alt + v
  • 成功后在markdown源碼頁面會插入 圖片的markdown代碼 如下圖一

markdown語法學習

網上關于markdown的語法學習文章很多，大家可以搜索下從簡單的學起，建議邊寫邊查，你會愛上markdown的，對于部分插件可能由于不同markdown語法解析的引擎的差異會有不同的樣式效果，不過都還能接受這種差異。以下資源地址是比較簡介快速的入門帖子 個人建議：很多知識可以不用大而全的學，在使用過程中不斷變強是比較務實的操作

• Markdown 教程
• Markdown 語法手冊完整整理
• Markdown語法大全(超級版)

markdown的格式轉換

可以直接通過Markdown PDF的能力把markdown文件轉換成 pdf html png jpeg等各種格式

邊寫邊看

點擊vscode編輯器右上角的分欄查看圖標即可實現邊寫邊看 如下圖箭頭所示

復制到公眾號

在右邊的預覽框里點擊右鍵 Open in Browser 即可在瀏覽器中打開文章 復制全文粘貼到公眾號里即可。復制到公眾號的時候再檢查一下格式是否錯亂，還是會存在兼容性問題

結語

由于vscode插件的markdown語法解析引擎對于復雜的語法支持不太好，有些語法沒辦法正常使用，但基本上能夠滿足90%的場景，對于需要使用流程圖可以借鑒第三方軟件實現再配合圖片的方式來曲線救國。

總結

以上是生活随笔為你收集整理的vscode markdown插件_如何用Markdown写公众号的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。