# 如果把图片存为网图
最开始使用markdown写文档，发现操作图片不是特别方便。于是借助了第三方平台"语雀"写文章。语雀可以导出md的文章，于是我想通过vuepress放一份到自己的github中。
但是是发现部署后图片访问不到。为了解决这个问题，查了很多资料，这里总结一下存储图片的方法：
# 1.使用Github作为免费图床
# 1.1 操作步骤
- 新建一个repositories
- 进入repositories下的wiki选项中
- 复制wiki对应的克隆地址
- 在本地克隆项目
git clone https://github.com/hpstream/hpstream.github.io.wiki.git (opens new window)
- 进入文件夹，将要上传的图片放在文件夹中
- 打开命令行，依次输入命令：
git add ./
git commit -a-m "update"
git push
- 现在已经将图片放置Github图床，
图片的地址https://raw.githubusercontent.com/wiki/garuhester/ImageBed/photo.png
garuhester为你的Github用户名（username）
ImageBed为你创建的repository的名称（repository）
photo.png为图片的名称
// 例子
https://raw.githubusercontent.com/wiki/hpstream/hpstream.github.io/image/183941921.jpeg
就完成了自己的图床了。
# 1.2 优缺点
- 优点：不用花钱。不用买服务器。
- 缺点：操作麻烦，需要先保存图片。
# 2. 通过github的隐藏功能issue
当前Github上没有提供asset管理工具，但是利用Github中的issues特性可以进行CDN asset的管理，合理利用issues会使得上传文件到知识库特别简单，这些资料不会被commit/change跟踪，当在知识库中创建issues时，可以采用简单的drag-n-drop拖曳上传资源至repository, 步骤如下：
# 2.1 操作步骤
- 创建一个新issue
- 然后拖曳图片进去，一次可以添加多个文件（然后发现直接图片的引用复制过来，粘贴到markdown）
- 上传完 issue 之后，就可以直接在图片上右键复制图片URL
2.1 优缺点：
- 优点：可以使用cdn加速，免费。
- 缺点：麻烦，手动提issue。
# 3. 使用第三方存储平台存储图片如：语雀
# 3.1 操作步骤
1.在语雀写好文章，保存。点击导出markdown格式。 2.导出vuepress中（由于vuepress使用的就是markdown，所以很方便）
注意：在使用vuepress 生成页面时，发现图片访问时403,且图片不展示。 ** 解决方案：
html中加了 <meta name="referrer" content="no-referrer" />
vuepress中config.js中添加：
head: [
['meta', {
name: 'viewport',
content: 'width=device-width,initial-scale=1,user-scalable=no'
}],
[
'meta', { name: "referrer",content:"no-referrer"}
]
]
这样子在部署时，图片就可以访问了。
本人用的就是第三种