vscode+gitee+picgo实现稳定图床
<h1 id="目录">目录:</h1><p></p><div class="toc"><div class="toc-container-header">目录</div><ul><li>目录:</li><li>1. 为什么使用vscode+gitee+picgo实现完美图床</li><li>2. 安装VSCode<ul><li>2.1 安装VSCode软件及相关插件</li></ul></li><li>3. 安装picgo</li><li>4. 准备Gitee图床</li><li>5. 配置相关设置</li><li>尾声</li></ul></div><p></p>
<h1 id="1-为什么使用vscodegiteepicgo实现完美图床">1. 为什么使用vscode+gitee+picgo实现完美图床</h1>
<p>为什么要选择VSCode+PicGo+Gitee<br>
主要是平时写文章的平台，要么是收会员费用，要么是本站图片链接只能在本站网站访问，换一个平台，图片就裂了，图片问题困扰我很久，也是经过很多试用，最终选定这个工具组合，之前图片仓库使用的是Github，但是在国内，Github的访问速度简直感人！所以后来就把Github替换成了Gitee，Gitee在国内，访问速度快多了,之前的写文章使用的是Typora，但是现在收费了，就改用VSCode。</p>
<h1 id="2-安装vscode">2. 安装VSCode</h1>
<h2 id="21-安装vscode软件及相关插件">2.1 安装VSCode软件及相关插件</h2>
<ol>
<li>进入VSCode软件官网：https://code.visualstudio.com，然后下载VSCode。<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/image.png"></li>
<li>VSCode安装后，下载中文插件并安装。<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/image-1.png"></li>
<li>安装Markdown插件：
<ol>
<li>Markdown All in On</li>
<li>Markdown Preview Github Styling</li>
<li>Markdown PDF</li>
</ol>
<ul>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/image-2.png"></li>
</ul>
<ol start="4">
<li>安装PicGo插件</li>
</ol>
<ul>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_183.png"></li>
</ul>
</li>
</ol>
<h1 id="3-安装picgo">3. 安装picgo</h1>
<ol>
<li>
<p>进入PicGo官网: PicGo官网</p>
</li>
<li>
<p>点击免费下载按钮<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_127.png"></p>
</li>
<li>
<p>找到一个正式版本, 比如现在最高的正式版是2.3.1, 找到这个版本的资源, 然后展开所有资源.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_128.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_129.png"></p>
</li>
<li>
<p>现在一般都是64位的系统, 可以下载这个软件.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_133.png"></p>
</li>
<li>
<p>下载好后, 打开软件安装, 点击下一步.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_138.png"></p>
</li>
<li>
<p>切换安装盘符和安装文件夹, 我这里是安装在 E:\PicGo, 换好后点击安装.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_139.png"></p>
</li>
<li>
<p>安装完成后, 点击完成打开PicGo<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_140.png"></p>
</li>
<li>
<p>点击插件设置, 搜索gitee, 然后安装gitee-uploader 1.1.2<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_141.png"></p>
</li>
<li>
<p>点击安装后发生错误, 主要是由于PicGo软件是基于node.js, 用electron-vue开发的客户端, 这里我要去node.js 官网下载安装一下.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_142.png"></p>
</li>
<li>
<p>打开node.js官网: node.js官网, 下载左边的正式版(LTS版本), 然后按着引导进行安装.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_143.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_144.png"></p>
</li>
<li>
<p>勾选我同意, 然后下一步<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_147.png"></p>
</li>
<li>
<p>切换盘符, 我放在E:\nodejs,点击ok, 然后一直点击next<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_148.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_149.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_150.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_151.png"></p>
</li>
<li>
<p>点击Install进行安装.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_152.png"></p>
</li>
<li>
<p>等待的时候会有个弹窗, 点击是<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_153.png"></p>
</li>
<li>
<p>点击Finish, 到这nodo.js就安装完成了, 然后重启一下PicGo, 右下角右键重启PicGo<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_156.png"></p>
</li>
<li>
<p>再回到插件设置, 搜索gitee, 然后安装gitee-uploader 1.1.2<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_195.png"></p>
</li>
<li>
<p>安装中, 安装后会显示已完成<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_157.png"><br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_158.png"></p>
</li>
</ol>
<h1 id="4-准备gitee图床">4. 准备Gitee图床</h1>
<ol>
<li>
<p>首先你要有一个Gitee账号, 没有的可以去官网创建一个.Gitee官网<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_159.png"></p>
</li>
<li>
<p>登陆后点击右上角的 + 号, 新建一个仓库<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_162.png"></p>
</li>
<li>
<p>设置仓库用户名, 比如我这里叫: pic_bed, 仓库设置为 开源 , 然后勾选初始化仓库, 模板文件设置为 ReadMe文件, 最后点击创建按钮.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_167.png"></p>
</li>
<li>
<p>出现这个页面就说明仓库创建成功了.<br>
<img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_168.png"></p>
</li>
</ol>
<h1 id="5-配置相关设置">5. 配置相关设置</h1>
<ol>
<li>配置PicGo插件</li>
</ol>
<ul>
<li>
<p><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_180.png"></p>
</li>
<li>
<p>repo：用户名/仓库名称，比如我自己的仓库yatok/picture-bed，找不到的可以直接复制仓库的url,复制浏览器的仓库地址，而不是页面左上角显示的，容易出现大小写问题</p>
</li>
<li>
<p><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_172.png"></p>
</li>
<li>
<p>branch：分支，这里写上master</p>
</li>
<li>
<p>token：填入码云的私人令牌</p>
</li>
<li>
<p>path：路径，一般写上img,我默认没填</p>
</li>
<li>
<p>customPath：提交消息，这一项和下一项customURL都不用填。在提交到码云后，会显示提交消息，插件默认提交的是 Upload 图片名 by picGo - 时间</p>
</li>
</ul>
<ol start="2">
<li>获取自己的token , 点击右上角找到设置点击</li>
</ol>
<ul>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_175.png"></li>
<li>点击私人令牌, 然后生成新令牌.</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_176.png"></li>
<li>选择和我相同的权限, 然后提交, 这里会验证一下账号密码(也就是登录密码).</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_178.png"></li>
<li><strong>生成的私人令牌只会显示一次,一定要保存好, 如果丢失的话就需要重新生成.</strong></li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_179.png"></li>
<li>然后设置为默认图床后点击确定.</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_181.png"></li>
<li>测试一下是否有效, 截一张图, 按快捷键: Ctrl+shift+P, 右下角显示上传成功, 可以使用Ctrl+v 把图床的链接粘贴到Markdown文档.</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_188.png"></li>
<li>下面这张是获取网络图床显示的图片.</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_189.png"></li>
<li>去Gitee仓库看看上传的图片</li>
<li><img src="https://gitee.com/lxhyuthboy/lxh_pic_bed/raw/master/image/LXHYouth_2024-03-02_190.png"></li>
</ul>
<h1 id="尾声">尾声</h1>
<ul>
<li><strong>到此教程就结束了, 但是学习无止境, 祝大家在知识的海洋中勇往直前.</strong></li>
<li><strong>转载: 请附上本文链接</strong></li>
</ul><br><br>
来源：https://www.cnblogs.com/LXHYouth/p/18049377
頁:
[1]