你要是还学不会，请提刀来见 Typora+PicGo+Gitee + node.js 打造个人高效稳定优雅图床

经过前面两弹的介绍，相信大家对图床都不陌生了吧，但是小魔童觉得这样做法还是不方便，使用 github的仓库来存放图片，如果不能上外网的话是不能展示图片的，自己可以上外网还不行，需要别人上外网才可以看到我文章中的图片，这也太难了。。。

另外使用 github issue的方式确实会好了很多，至少不需要外网了，直接在国内网络中就可以解决该问题，可是问题来了，小魔童比较懒，觉得这种方式每一次都要拖拽图片到 issue中，且自己还要备份一下图片，还是觉得不优雅，不喜欢，我想实实在在的做个懒人

那行，那就满足你的要求，今天我们来介绍和实际操作一个高雅的使用图床的方式

Typora+PicGo+Gitee + node.js 打造个人高效稳定图床

• 推荐指数五颗星

• 实用指数五颗星

• 易操作指数五颗星

• 宜人性五颗星

部署PicGo

• 访问 picgo官网，进行下载

https://github.com/Molunerfinn/PicGo/releases

image

<figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226221307800</figcaption>

一定不要安装在 C:\Program Files\ 下，否则后面 PicGo上传图片的时候一定会失败，因为 PicGo无法解析这一路径，例如我的安装路径为

E:\picgo\PicGo

安装node.js

• PigGo需要使用插件的方式才可以将图片上传到 gitee，需要安装 node.js，点击如下链接进行下载

https://nodejs.org/dist/v12.16.1/node-v12.16.1-x64.msi

• 安装成功之后，可以选择使用命令的方式更换镜像源（也可以不做此步操作）

window 进入 cmd，执行如下语句

npm config set registry https://registry.npm.taobao.org

安装github-plus插件

• 运行PicGo，单击插件设置，在搜索中输入github，安装搜索结果中的github-plus

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226223257358</figcaption>

• 若在点击安装时， PicGo弹出需要安装 node.js 并重启 PicGo，则直接重启电脑，即可解决此问题

• 等待安装 github-plus的过程中，可以继续执行如下步骤

部署Gitee

• 在 gitee上建立一个仓库专门用于存放图片，例如我的：

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222200113</figcaption>

• 获取自己账号的token

  点击右上角自己的头像 -> 设置 ->

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222425832</figcaption>

  点击左侧私人令牌 ->

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222504818</figcaption>

• 生成新令牌 ->

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222644727</figcaption>

• 勾选权限， PicGo只需要 user_info 和 projects 的权限 ->

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222745679</figcaption>

• 保存 token，该token只会出现一次，离开页面后就不会再出现了

继续设置PicGo

• 回到 PicGo，点击图床设置->githubPlus，在设置中填入repo和token，并选择origin为gitee，即可完成设置。其中，repo要填入owner/repoName 例如上图中的仓库名，填入红框中的字符串即可

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226222200113</figcaption>

• 如图

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226223743460</figcaption>

部署Typora

• 下载 Typora，网上随便一搜则可下载得到

• 点击 Typora左上角的文件->偏好设置

• 在弹出的界面中定位到图像，选择插入图片时选项为上传图片，并勾选对网络位置的图片应用上述规则

• 设置完成如图所示

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226224209182</figcaption>

• 选择上传服务为PicGo(app)，点击验证图片上传选项，如果出现如下图所示界面，说明配置已成功，然后你就可以直接在Typora中插入图片了，Typora会自动上传并替换图片地址为网络地址。

  image

  <figcaption style="margin: 10px 0px 0px; padding: 0px; line-height: inherit; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">image-20210226224336681</figcaption>

自己写文档的时候上传图片

• 只需要将图片复制到 Typora里面， PicGo会自动帮你上传图片到 Gitee上，且可以自己重命名

这下子，有了 Typora+PicGo+Gitee \+ node.js大法，写文章写博客就会更加专注了

作者：小魔童哪吒

感谢各位的观看，若你能实际操作，收获会更大，麻烦帮忙点个在看哟！