VScode+PicGo+Github+jsdelivr使用图床书写Markdown

本文讲述使用Github做为图床，VScode搭配Picgo插件书写Markdown，并使用jsdelivr进行CDN加速的配置流程。

准备阶段

首先进行如下准备工做，都很简单，再也不赘述。

1. 注册Github帐号
2. 安装VScode
3. 为VScode安装Picgo插件

配置github

建立仓库

1. 登录github，点击右上角加号，选择“New repository”建立新仓库
   
2. 设置仓库属性，具体以下图所示。值得注意的是，仓库可见性必须设为public，不然没法使用仓库做为图床。
   

获取token

生成一个Token用于操做GitHub repository。

1. 点击头像，选择“setting”
2. 进入页面后，依次点击“Developer settings-Personal access tokens”，而后点击“Generate new token”按钮，获取一个新的token。
3. 点击后，在新出现的页面“Note”选项中键入token的名称，而后勾选下方repo权限后，点击页面最下方“Generate token”按钮
4. 建立成功后，会生成一串token，这串token以后不会再显示，因此最好将其记录下来。

配置Picgo插件

打开VScode，找到Picgo插件，在插件上“右击-扩展设置”，往下拉，在设置中找到如下属性并修改：

1. "Current"：当前使用图床，修改成github
2. “Github: Repo”：github仓库，设置为用户名/仓库名，如geoli91/ImageHosting
3. “Github: Path”：图片须要存放的文件夹，即图片存放路径为用户名/仓库/path/图片名.png。可选，若是有须要能够设置，如img/
4. “Github: Custom Url”：自定义域名，能够经过设置该项使用CDN加速，如使用jsdelivr加速这可设置为https://cdn.jsdelivr.net/gh/geoli91/ImageHosting，其中结尾为用户名/仓库名。若是不使用CDN加速，则无需修改。
5. “Github: Branch”：分支名，若是仓库只有默认的一个分支，则直接填master便可
6. “Github: Token”：从Github得到的提交token，复制粘贴便可，注意保护好不外泄。

配置jsdelivr CDN加速

将Picgo插件中“Github: Custom Url”自定义域名属性设置为https://cdn.jsdelivr.net/gh/用户名/仓库名开头，如https://cdn.jsdelivr.net/gh/geoli91/ImageHosting便可自动使用jsdelivr 免费CDN加速服务。尤为是2020年开始https://raw.githubusercontent.com被墙以后，更是只有利用CDN才能访问github图床了。

Picgo快捷键

1. ctrl+alt+u：从剪贴板插入图片
2. ctrl+alt+e：手动选择要插入的图片

OK，打完收工，开始享用吧

---

本文参考：

1. PicGo帮助文档 https://picgo.github.io/PicGo-Doc/zh/guide/config.html#github图床
2. 博客 https://blog.csdn.net/weixin_46486966/article/details/104968819
3. https://ee.ofweek.com/2020-06/ART-11000-2818-30445800.html