Picgo + Gitee +Typora（自動上傳）搭建markdown免費圖庫

• Picgo + Gitee +Typora（自動上傳）搭建markdown免費圖庫
• 一、需要的軟體
• 二、使用Gitee（碼云）搭建圖床
• 三、node.js安裝
  • 1、下載安裝
• 四、PicGo 下載安裝配置
  • 1、下載安裝
  • 2、PicGo gitee插件設定
    • (1)、gitee插件安裝
    • (2)、PicGo設定
    • (3)、gitee插件設定
• 五、Typora 設定
• 六、坑（很重要！！！）
  • 1、關于node.js的
  • 2、關于Picgo的
  • 4、關于Typora的（很重要！！）
    • (1)、博客網站決議不了圖片
    • (2)、Typora上傳失敗
  • 5、圖片的命名導致博客五法決議圖片網址
• 七、參考參考說明

? 在寫博客的是時候，之前那都是直接在博客網站上面寫好了，再一一插入圖片，當要在同時2個以上的博客上面發表的時候就會出現圖片參考的問題，在網上找了一久的資料，發現了可以利用Picgo + Gitee +Typora搭建一個markdown檔案的免費圖庫，感覺非常可行，于是立馬嘗試了一下，確實可行，以下是這個解決方案的個人實踐記錄，

以下方案參照了網上大神的方案，并非我原創，內容是根據自己實踐下來的記錄，

一、需要的軟體

1、Picgo軟體（官網下載：https://github.com/Molunerfinn/PicGo）

2、注冊Gitee（碼云）賬號，搭建圖床

3、node.js本地安裝

4、Typora軟體

二、使用Gitee（碼云）搭建圖床

1.注冊Gitee（碼云）賬號，官網地址：https://gitee.com/

2.新建Gitee倉庫

3.開啟Gitee Pages服務

Gitee Pages 是一個免費的靜態網頁托管服務，您可以使用 Gitee Pages 托管博客、專案官網等靜態網頁，如果您使用過 Github Pages 那么您會很快上手使用 Gitee 的 Pages服務，目前 Gitee Pages 支持 Jekyll、Hugo、Hexo編譯靜態資源，

4.生成To私鑰令牌

步驟按照圖片所示進行操作即可，記住生成token以后需要保存下來（復制到哪里留著，PicGo里面用得到）

三、node.js安裝

1、下載安裝

(1). 官網地址：

? 英文：https://nodejs.org/en/

? 中文：http://nodejs.cn/

Windows7需要降級安裝歷史版本地址：

? https://nodejs.org/en/about/releases/

? https://nodejs.org/download/release/latest-v10.x/

(2). 安裝

? 像裝其他軟體一樣安裝即可，windows7安裝完了會自動配置環境變數，其他的好像需要自己配置，

安裝完成之后有一部需要驗證，

安裝完成之后驗證即可

四、PicGo 下載安裝配置

1、下載安裝

1.官網（開源GitHub：https://github.com/Molunerfinn/PicGo）
根據作業系統來下載對應的安裝檔案（GitHub官網）
(1). Windows 用戶請下載最新版本的 exe 檔案，
(2). macOS 用戶請下載最新版本的 dmg 檔案，
(3). Linux 用戶請下載 AppImage 檔案，

有一點需要注意，目前最新的正式版是2.3.0-beta.4，名字帶“-beta.x”的是測驗版本，貌似說是不太穩定，建議就下載穩定版本的，這點在GitHub 專案網站https://github.com/Molunerfinn/PicGo/releases/上都有版本說明，

2、PicGo gitee插件設定

(1)、gitee插件安裝

如圖所示：在“插件設定”中搜索gitee，可以搜出2個插件，根據網上的資料，2個插件均可以使用，安裝設定基本都差不多，我自己安裝的是gitee-uploader1.1.2

(2)、PicGo設定

安裝完成以后設定圖床要要顯示的圖床庫：

(3)、gitee插件設定

gitee-uploader1.1.2插件設定，另外gitee 2.0.3 設定也基本一致

repo：用戶名/倉庫名

最簡單的辦法，打開gitee倉庫后，看網址：https://gitee.com/abcd/bg-gys，那么repo：abcd/bg-gys

path：gitee倉庫中你要存盤昭通的路徑，簡單說就是你新建的gitee倉庫的里面的檔案夾路徑

假如：當gitee倉庫的名：bg-gys，你在下面新建了一個image的檔案夾存盤照片，那么path為：image

token：就是gitee的私人密鑰，直接粘貼進去即可，

branch：gitee倉庫的分支名，一般會默認填寫

到這里以后基本就完成 了可以在PicGo中嘗試是否可以上傳

五、Typora 設定

官網地址：https://typora.io/

自行下載安裝即可

Typora其實就一個重要的點需要設定：設定使用PicGo上傳圖片

設定完成以后，在用Typora寫markdown檔案的時候，直接復制圖片到文章中即可選擇上傳，上傳以后的圖片地址就是gitee圖床中的地址

六、坑（很重要！！！）

1、關于node.js的

(1). 因并未學過node.js，這一步為什么需要安裝，是因為在PicGo安裝Gitee插件的時候，如果是不提前裝node.js，Gitee插件會一直處于"安裝中....."，因只是一個工具，并未深入研究，如果清楚的大神可以告訴我，謝謝！

(2). 安裝完成以后要重啟

(3). Windows系統下載.msi格式的檔案（這點不知道算不算坑，可能對于熟悉node.js的不算吧）

(4). Windows作業系統對應的node.js版本有要求，

? 如果作業系統是windows7，是裝不了14.16.0 （目前官網最新版）的，需要降級安裝12以及下，我是下載了10.X版本的，親測可以，

因為windows 7 如果是安裝14.X版本會報錯：

?

2、關于Picgo的

(1)、安裝PicGo之前一定要先安裝node.js，不然gitee的插件會一直裝不上，網上很多博客里面都沒提這一點

(2)、在gitee插件設定中的path，這個值，你要先想好，如果一直改動，會出現上傳失敗的情況，不知道是PicGo的bug還是我的操作問題，我出現了很多次（因為我頻繁改倉庫的地址），挺煩的，

4、關于Typora的（很重要！！）

(1)、博客網站決議不了圖片

這一點是最坑的，網上我就沒找到過資料來說明這一點，不知道是我的問題還是其他人都沒遇到過：

? 在Typora記錄的時候，復制圖片到文章中，上傳以后的地址就是gitee圖床的地址，你可以直接復制到網上的博客、微博等等，但是我在復制到博客的時候發現，復制進去決議不了圖片，研究了大半天，發現我的gitee沒問題，里面的圖片也能正常訪問，但是當我看到我在gitee上面直接打開我上傳的圖片網址以后，不淡定了：
網址如下：

https://gitee.com/abcd/blogs-gallery/blob/master/image%20/%20202103/2020030701-06-01-BlogsGallery-Typora.png

然而我在Typora文章中看到的圖片地址是：

https://gitee.com/abcd/blogs-gallery/blob/master/image / 202103/2020030701-06-01-BlogsGallery-Typora.png

在master分支下面的檔案夾路徑：image / 202103/，中間多了2個空格，瀏覽器訪問的時候會直接將空格決議：%20
所以這就是為什么我寫好的博客，復制進去博客網站的時候圖片決議不了的原因了
解決辦法：
我還是正常的在Typora上面寫文章，但是在寫完以后，我是這樣處理的：
將/image / 202103/直接替換為/image%20/%20202103/

感徑訓是挺麻煩，但是暫時也找不到其他的辦法解決，希望路過的大神予以指點一二，

(2)、Typora上傳失敗

如果更改過PicGo的一些設定，server的監聽埠會改變，此時要檢車PicGo的server監聽埠號跟Typora的埠號是否一致，我在自己折騰的程序中，都是這個原因導致上傳失敗的，

查看Typora埠：

PicGo埠號查看：

5、圖片的命名導致博客五法決議圖片網址

我的習慣是會把自己記錄筆記、文章的截圖保存下來，命名規則是這樣的：

日期+序號+根據這篇文章的標題+圖片的內容+......

在搭建完這套免費的圖床以后，使用程序中發現的，因為你的圖片要上傳到Gitee上面，文章匯總參考的地址就是Gitee上面的地址，所以在圖片命名上要注意以下問題：

? (1)、圖片名稱中不要出現“漢字”，經量用英文或者是拼音

? (2)、不要出現特殊的符號，目前我會用“-”,這個暫時沒發現有什么問題，但是在用"()"就會出現一些博客上面參考不到

暫時就發現了這2點，如果有其他的問題，非常感謝給我留言說明，

七、參考參考說明

1、關于node.js，我本不熟悉，文章“三、node.js安裝”是參考了這位博主的文章：

https://blog.csdn.net/adisonW/article/details/95475229/

2、關于Typora+PicGo的一些設定，參考了這位博主的文章：

https://blog.csdn.net/qq_40683225/article/details/105124810?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-1&spm=1001.2101.3001.4242

3、Gitee的幫助檔案：https://gitee.com/help/articles/4136/

在寫此文的時候可能還有少部分是參考了其他資料，但是整理的時候我已經找不到原文出處了，如果原文作者看到，請及時聯系我，我在文章中加上參考出處，謝謝！

免責宣告：

本文中使用的部分內容來自于網路，如有侵權,請聯系博主進行洗掉，

轉載宣告：

寫博客不易，請尊重原作者！！
歡迎大家閱讀、轉載，如果是 **整文轉載** 請在文章開頭或者結尾處 **注明 原文地址、作者**，如果是**大段參考** 請**備注 參考鏈接**，

標籤：其他

上一篇：戈登·摩爾

下一篇：如何將 IPhone 的檔案匯入 Linux