前言
使用 Hexo 打造个人博客的时候你总会发现需要一个图床，免费又限制少的当属 GitHub，当然免费存在的问题，GitHub 的问题就是访问速度慢，这时候使用 jsDelivr 作为 GitHub 的免费 CDN 解决方案，就能打造一个即快速又免费的图床了，而 vscode 的扩展 PicGo 的优势就在于能像复制粘贴一样高效快速的进行截图、上传、返回图片 url、插入 markdown 格式，从而让你的关注点一直集中在 markdown 内容本身，而不是分散关注到上传图片，获取地址返回，书写 markdown 的图片。
GitHub 设置
创建一个仓库
例如我们创建了一个名为PicGoBed的仓库，用来存放我们的图片，注意仓库必须是 public 的，这样才能作为图库访问
生成 GitHub 的 token
目的
生成 token 的目的是为了让 PicGo 能有访问我们仓库的权限
方法
进入你 GitHub 的 settings（注意是账号的 settings 不是你仓库的 settings），依次进入Settings > Developer settings > Personal access tokens，点击Generate new token进入页面，填写 Note，勾选 repo 的权限，然后生成 token。
生成完成后会出现一个唯一 token，请记录下来，这个 token 在页面刷新后就会消失并且不能找回
vscode 的 PicGo 安装和配置
安装 PicGo 扩展
配置 PicGo 扩展
打开 vscode 的设置，搜索picgo, 定位到如下设置, 按照图片中的说明来设置,其中需要注意的是自定义 url,在这里我们就用到了 jsdelivr 的免费 CDN 支持,规则就是https://cdn.jsdelivr.net/gh/<username>/<repo>,如果你的仓库使用 release 来区分不同版本的话可以使用https://cdn.jsdelivr.net/gh/<username>/<repo>@<release version>规则来导入
使用
以上配置完成后,我们就能愉快的使用 PicGo 来为我们 markDown 自动上传图片并生成代码了,我们看一下 picgo 扩展的使用方法
快捷键
You can change all the shortcuts below as you wish.
| 操作系统 | 从剪贴板上传图片 | 从文件管理器中上传图片 | 从 input box 中上传图片 |
|---|---|---|---|
| Windows/Unix | Ctrl + Alt + U | Ctrl + Alt + E | Ctrl + Alt + O |
| OsX | Cmd + Opt + U | Cmd + Opt + E | Cmd + Opt + O |
功能
从剪贴板上传图片
从文件管理器中上传图片
从input box中上传图片
使用选中的文字作为上传图片的文件名
注意: 这些字符: \$, :, /, ? 和换行将会在图片名中被忽略 . (Because they are invalid for file names.)