1. 程式人生 > 實用技巧 >Typora + PicGo-Core + Github 實現圖片上傳到Github

Typora + PicGo-Core + Github 實現圖片上傳到Github

為了解決為知筆記使用Typora編輯markdown檔案圖片丟失的問題,我採用了PicGo-Core + Github實現了自定圖床的功能。

本次只提供Windows下的配置。

下載PicGo-Core

由於我的電腦有nodejs環境,所以我使用的是npm命令安裝picgo, 命令如下:

npm install picgo -g

安裝完成後,檢查命令列輸出, 記錄下紅色框內的路徑。

輸入命令檢視版本,如果有輸出則新增成功。

picgo -v

安裝github-plus

官方提供的github上傳相簿不好用,安裝一款新的上傳外掛github-plus, 命令列執行:

picgo install github-plus

安裝成功後會有提示。

Typora影象設定

Typora中配置影象上傳資訊。

設定PicGo的配置資訊

如上圖所示,分為2個步驟:

  1. 上傳服務選擇PicGo-Core(command line)
  2. 開啟配置檔案,在開啟的配置檔案,新增相關資訊。
    {
     "picBed": {
       "uploader": "githubPlus",
       "current": "githubPlus",
       "githubPlus": {
         "branch": "master",// 倉庫分支
         "customUrl": "https://cdn.jsdelivr.net/gh/jxiaow/cdn-images@latest", // 訪問的自定義url
         "origin": "github", // 存放的圖片型別
         "repo": "jxiaow/cdn-images", // 存放圖片的倉庫
         "path": "blog-images",// 存放圖片的倉庫目錄下的資料夾
         "token": "" // 訪問github的倉庫的token, 不知道怎麼設定的自行百度
       }
     },
     "picgoPlugins": {
       "picgo-plugin-github-plus": true // 啟用github-plus外掛
     },
     "picgo-plugin-github-plus": {
       "lastSync": "2020-11-05 07:54:47"
     }
    }

    測試配置

    根據上述配置完畢後我們需要進行測試連結是否成功,在測試之前還要進行如圖所示的修改:

  3. 上傳服務修改為Custom Command
  4. 自定義命令 : picgo upload
  5. 點選驗證圖片上傳選項
  6. 如果顯示驗證成功,則表示配置完成。

圖片上傳

將圖片拖入Typora中,然後在圖片單擊右鍵,圖片上傳即可。