VSCode 中有一个插件 Markdown Image 还算好用，能够一键将图片上传然后将链接粘贴到 Markdown 中。
之前都是把 Markdown 直接贴在对应项目里，然后经过相对链接拜访，运用的时候发现一些问题：
- 项目的相对途径未必是上传后的实在途径，导致每次都要手动编辑地址。比如我的 Blog 中的上传图片的地址是
/public/image，但 public 到了发布时会被 copy 到根途径，此刻自动生成的相对地址就不匹配了。 - Markdown 仿制到其他地方时，图片资源要再做一次仿制粘贴。比如我要把 Blog 中的某一篇发到 Juejin，由于源码是相对途径，而直接仿制内容又忧虑样式问题，所以每次都需要把图片再仿制一遍。
不过 Markdown Image 中有提供其它图床功用，决定将图片放到图床中，最终决定将图片放到 GitHub 图床。
GitHub 图床创立
首先去 GitHub 中创立一个空仓库，这儿后边会运用 GitHub Pages，所以设置为 Public，假如运用其它 host 服务，可按需挑选。然后后边 host 服务可按需挑选，这儿举例两个：
直接运用 jsdelivr
我未直接运用 jsdelivr 主要是忧虑它挂掉（曾经遇到过几次）。运用 jsdelivr 则什么都不需要做，直接运用即可：
格局为：https://cdn.jsdelivr.net/gh/${username}/${repository}@${branch}/${filepath}。
- username 为 GitHub 用户名
- repository 为你的仓库名称
- branch 为分支名
- filepath 为文件途径
运用 Pages 和 Cloudflare
完成后去项目设置中开启 Pages 服务，并进行设置。自定义域名可按需设置，这边运用 Cloudflare 做域名解析和加快。
设置完成后拜访格局即为： https://stg.heyfe.org/${filepath}。
这个方案好处是不必忧虑 jsdelivr 挂掉，但是害处是 pages 服务启用有点慢，上传完成后 GitHub Pages 生效中间大概存在 10 分钟的间隙，此段时刻拜访图片就拜访不到了。
Markdown Image 装备 GitHub 图床
这是卡我最久的一步，主要是 Markdown Image 中一个装备项很容易让人误解。
在 Markdown Image 中装备 GitHub 图床主要需要以下几个参数：
此处不小心将 token 也带上去了，不过该 token 已经删去，咱们截图时也要留意此类安全隐患。
- CDN 即上面咱们讲的 host 服务，按照装备修正即可
- Path 是将图片上传到的途径
- Repository 即项目的仓库地址
- Token 需要去 GitHub Token 页面进行生成
此处 CDN 和 Path 都没什么好说的，重点说下 Repository 和 Token
Repository
此处装备的 Repository 地址不同于咱们平常运用 git 时的地址，所以一定要自己看好格局是： https://github.com/${username}/${repository} 而不是 https://github.com/${username}/${repository}.git，我习惯性的认为是 git 中的地址，导致一向上传失利各种查找、排查了十来分钟才找到原因。
Token
Token 咱们需要去 GitHub 设置 中去生成，早期 GitHub 中的 Token 权限设计存在一些安全隐患，现在推出了新的 Token。而咱们的 Token 是给插件运用的，无法彻底保证其安全性，所以主张运用新 Token。
点击创立后会跳到 Token 生成页面，此处要留意的是 Expiration 和 Repository access 以及下方的权限设置。
此处主张过期时刻设置为 1 年，最大就一年，所以后期要记住上传失利过来查看下 Token 是否失效。老 Token 有永久 Token，但是权限设置存在安全隐患，激烈不主张。
至于 Repository access 则主张只挑选对应的仓库。
而 Permissions 只需要勾选 Contents 即可。
创立后仿制 Token 将其粘贴到装备中。
作用
然后咱们在 VSCode 即可经过快捷键或指令粘贴剪切板中的文件。
FAQ
图片上传失利
假如呈现如下两种错误，大概率是 Markdown Image 中的装备出错了，请仔细查看装备，特别要留意 Repository 字段。
An SSL error has occurred and a secure connection to the server cannot be made. Would you like to connect to the server anyway?
upload File Failed: Upload file failed: Not Found.
上传没有反应
开发者面板会呈现 Get 0 Images 的提示。大概率是由于你的剪切板中没有可粘贴的图片。
本文正在参加「金石方案」
