VScode + markdown + VS-PicGo（GitHub图床）教程

最新推荐文章于 2025-05-04 18:34:36 发布

原创最新推荐文章于 2025-05-04 18:34:36 发布 · 968 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vscode #github #ide

markdown 专栏收录该内容

1 篇文章

订阅专栏

本文档详细介绍了如何利用VScode、Markdown和PicGo搭建GitHub图床进行笔记创作。首先，你需要安装VScode及其相关插件，然后创建一个公开的GitHub仓库。接着配置PicGo，包括设置GitHub仓库信息和用户Token。完成配置后，你可以通过VScode便捷上传图片，并用Markdown语法撰写富文本内容。测试部分展示了Markdown的基本语法和PicGo的图片上传效果，证明了这套组合在笔记和内容创作中的实用性。

#VScode + markdown + VS-PicGo（GitHub图床）教程

文章目录

1.VScode插件安装

20220808214819
安装VScode
VScode官网

20220808213739
20220808213717
打开VScode并安装以上插件

20220808214105
在此搜索插件

2.GitHub仓库创建

20220808221504
20220808221600
必须是Public

3.PicGo配置

vs-picgo 官网

20220808215123
20220808214641
打开PicGo的扩展设置，找到以上设置
Current: 选择github
Branch: 选择自己的分支
20220808215444

Custom Url: 图床访问的Url
建议使用:
https://gcore.jsdelivr.net/gh/用户名/仓库名
可以加快图片访问速度

Path: 仓库下的文件夹位置
Repo: 用户名/仓库名（即打开仓库右上角显示的）
20220808220013

Token: Github的用户token
20220808220157
打开Github的Setting

20220808220307
打开Developer settings

20220808220341
20220808220413
创建新token

20220808220510
Note: token名称
Expiration: 有效期，选择 No expiration

20220808220723
勾选 repo

20220808220920
复制token
建议复制下来保存在其他地方，防止以后需要使用

4.测试

VScode markdown测试

20220808223614
点击右上角此图标可以开启markdown预览

加粗的文字
倾斜的文字`
斜体加粗的文字
~~加删除线的文字~~

引用的内容

引用的内容

引用的内容

分割线

列表内容

列表内容

列表内容

列表内容
列表内容
列表内容

表格	表格	表格
表格	表格	表格
表格	表格	表格
表格	表格	表格

代码
printf("这是一行代码")

    int main(){
        printrf("这是代码块")
    }

20220808223547

VS-PicGo测试

20220808224009
VS-PicGo快捷键，可能会与其他软件的快捷键有冲突

20220808224107
20220808224128

以上即为VScode + markdown + VS-PicGo的教程，用来做做笔记还是十分方便实用的