跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客GitHub 精选镜像工具UI配色美学隐私政策关于联系
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
编程语言Node.js大前端

PicGo 结合 GitCode 与 Typora 搭建免费图床指南

介绍如何使用 PicGo、GitCode 和 Typora 搭建免费图床。步骤包括安装 PicGo、Node.js 环境和 Typora 编辑器;在 GitCode 创建公开仓库并生成访问令牌;配置 PicGo 插件连接 GitCode 仓库;设置 Typora 调用 PicGo 实现自动上传图片;最后测试上传流程及配置 super-prefix 插件进行图片分类管理。该方案支持国内加速,无流量限制,适合技术写作场景。

猫巷少女发布于 2026/3/23更新于 2026/5/2318K 浏览
PicGo 结合 GitCode 与 Typora 搭建免费图床指南

为什么选择这组组合

对于程序员、笔记爱好者或技术写作者来说,使用 Markdown 写作时,图片的存储与同步一直是核心痛点——本地图片无法跨设备访问,直接插入网络图片又可能面临失效、丢失的风险。

图床(Image Hosting)则能完美解决这一问题:通过将图片上传至远程服务器并生成稳定可访问的外链,实现「一次上传、多端复用」。而在国内网络环境下,「PicGo+GitCode+Typora」 的组合堪称性价比拉满的图床解决方案,核心优势如下:

  • 免费无限制:GitCode 提供免费公开仓库,图片永久存储,无流量 / 容量限制
  • 国内加速:GitCode 服务器位于国内,相比 GitHub 加载速度快 50%+,无需科学上网
  • 无缝集成:Typora 粘贴 / 拖拽图片自动上传,无需手动处理链接
  • 版本可控:GitCode 自带版本管理,图片修改、回滚更方便
  • 可自定义:支持图片分类存储、CDN 加速、批量管理,灵活适配不同场景

这套组合的搭建门槛极低,全程无需复杂命令,新手仅需 10 分钟就能完成配置,拥有一个 免费、稳定、高速 的专属图床,彻底告别 Markdown 写作的图片管理烦恼。后续跨设备访问时,只需在其他设备上同步 Typora 文档,图片外链即可自动生效,真正实现「一次配置,终身可用」!

安装必备工具

1. 安装 PicGo(图片上传工具)

下载 PicGo 安装包

PicGo 是开源免费工具,支持 Windows/macOS/Linux 系统,建议优先下载官网最新稳定版,避免安装包异常:

  • Windows 系统:选择后缀为 .exe 的安装包
  • macOS 系统:选择后缀为 .dmg 的安装包
  • Linux 系统:选择对应发行版的包

根据自身系统选择匹配的安装包类型:

image

打开 PicGo 官方指南的下载入口:PicGo 下载

image

安装 PicGo(以 Windows 为例)

  1. PicGo 主界面如下:

点击完成启动 PicGo,Windows 可在右下角托盘找到图标,macOS 可在顶部菜单栏找到图标,说明安装成功:

image

选择安装路径,点击「安装」:

image

双击安装包:

image

2. 安装 Node.js(PicGo 插件依赖环境)

后续配置 GitCode 图床需安装专用插件,而插件安装依赖 Node.js 环境,必须提前安装:

打开终端(Windows 按 Win+R 输入 cmd),分别执行命令 node -v 和 npm -v,若显示版本号(如 v18.18.1),说明安装成功。

image

双击安装包,Windows 勾选'Add to PATH'(自动配置环境变量),macOS 默认配置,一路'下一步'完成安装;

image

官网下载,选择 LTS 长期支持版(稳定),根据系统选择安装包;

image

3. 安装 Typora(Markdown 编辑器)

Typora 支持免费试用,官网下载最新版,根据系统选择安装包,安装流程简单(Windows 下一步到底,macOS 拖拽至应用程序),此处不赘述。

image

配置 GitCode 仓库

我们需要在 GitCode 创建一个公开仓库,用于存放上传的图片(私有仓库无法生成公开外链,导致图片无法访问)。

1. 创建 GitCode 图片仓库

  1. 仓库名称:自定义(如 image-host、pic-bed,建议英文);
  2. 仓库描述:可选(如'个人图床,用于存放 Markdown 图片');
  3. 可见性:必须选「公开」(私有仓库外链无法访问);

点击「创建仓库」,等待页面跳转至仓库详情页,说明仓库创建成功。

image

填写仓库信息(关键参数务必正确):

image

登录 GitCode 官网,点击右上角「+」图标,选择「新建仓库」:

image

2. 生成 GitCode 访问令牌(授权 PicGo 访问)

PicGo 需通过 Token 授权访问 GitCode 仓库,Token 仅显示一次,务必保存好。

  1. 在左侧菜单找到「安全设置」-「私人令牌(Personal Access Token)」,点击「生成新令牌」;
  2. 配置令牌信息:
    1. 备注:自定义(如 picgo-token,用于区分用途);
    2. 有效期:建议选「永久」(避免定期重新生成,若追求安全可选短期);
    3. 权限:必须勾选「repo」(仓库读写权限,包含子权限),其他权限可取消;

点击「新建访问令牌」,页面会显示一串字符(即 Token),立即复制并保存到记事本(后续配置需用,刷新页面后无法再次查看)。

image

登录 GitCode 后,点击右上角头像,选择「设置」;

image

配置 PicGo 关联 GitCode

通过 PicGo 的 GitCode 插件,实现图片自动上传至 GitCode 仓库,步骤如下:

1. 安装 GitCode 上传插件

  1. 启动 PicGo,点击主界面左侧「插件设置」;
  2. 点击「安装」,等待安装完成后,重启 PicGo(插件生效需重启)。

在搜索框输入「gitcode」,找到对应插件:

image

2. 配置 GitCode 图床参数

  1. 点击主界面左侧「图床设置」,选择「gitcode」(插件安装成功后才会显示);
  2. 填写完成后,点击「确定」保存配置,再点击「设为默认图床」(后续上传默认使用 GitCode)。

填写配置参数(参考示例,替换为自己的信息):

字段填写说明
图床配置名自定义名称(如'我的 GitCode 图床'),用于区分不同图床配置
ownerGitCode 账号用户名(即 GitCode 的注册 ID)
repo在 GitCode 上创建的图床仓库名称(如)
分支图床仓库的默认分支(当前主流为 main,旧版仓库可填 master)
path图片在仓库内的存储路径(如填 images/,图片会存入仓库的 images 文件夹)
tokenGitCode 生成的私人访问令牌(需包含 repo 权限)
messageGit 提交备注,默认 picgo commit 即可,无需修改

image

点击【Default】或 + 号新增一个配置:

image

3. 测试 PicGo 图片上传功能

查看 GitCode 仓库可以看到上传成功的图片:

image

若上传成功,PicGo 会弹出「上传成功」提示:

image

打开 PicGo 主界面,点击「上传区」,拖拽一张本地图片到上传框,或点击「选择文件」选择图片;

image

配置 Typora 关联 PicGo(实现自动上传)

完成 PicGo 配置后,需让 Typora 与 PicGo 联动,实现「粘贴图片即自动上传」,无需手动打开 PicGo 操作。

  1. 插入图片时:
    • 选择「上传图片」
    • 勾选「对本地图片应用上述规则」「自动上传图片」「插入时自动转义图片 URL」
  2. 上传服务设定:
    • 上传服务选择「PicGo (app)」
    • PicGo 路径:选择 PicGo 安装路径

点击「验证图片上传选项」,若弹出「验证成功」提示,说明 Typora 与 PicGo 关联成功:

image

在左侧菜单选择「图像」,配置以下参数:

image

启动 Typora,点击顶部菜单栏「文件」-「偏好设置」(Windows);

image

全流程测试:从粘贴到访问的完整验证

测试「Typora 粘贴图片 → 自动上传至 GitCode → 生成外链」全流程:

额外验证:打开 GitCode 对应的图片仓库,进入 images 文件夹(或自定义路径),能看到刚刚上传的图片文件,进一步确认成功。

image

截图一张图片(或选择本地图片),按 Ctrl+V(Windows)粘贴到 Typora 中,粘贴后图片会短暂显示'上传中',随后显示图片,此时点击图片,右键选择「复制图片链接」,粘贴到浏览器中,若能正常显示,说明全流程搭建成功;

image

打开 Typora,新建一个 Markdown 文件;

image

进阶优化:super-prefix 插件实现图片自动分类

使用 super-prefix 插件可以为上传的图片自动添加动态前缀(如日期、自定义路径),可彻底实现图片的「上传即分类」,避免图片堆积在同一文件夹,后续管理图片时按路径查找即可,极大提升图床的整洁度和可用性!

1. 安装 super-prefix 插件

  1. 打开 PicGo 主界面,点击左侧「插件设置」:

在搜索框输入「super-prefix」,找到插件后点击「安装」:

image

2. 配置按「年 / 月」自动分类

  1. 点击「确定」保存配置。

在前缀格式框输入 YYYY/MM/,插件会自动拼接前缀与 GitCode 图床配置中的 path(如 path 设为 images/,前缀设为 2025/12/,最终路径为 images/2025/12/),实现按**日期(年/月)**分类:

image

super-prefix 插件支持设置图片的「文件名前缀格式」和「文件名格式」:

image

两个核心字段的功能如下:

字段名称功能说明示例格式
文件名个性前缀格式(以 / 结尾)定义图片在仓库中的存储分类路径(需以 / 结尾,与 GitCode 图床的 path 拼接)YYYY/MM/DD/
文件名个性格式定义图片本身的文件名规则(替代原文件名,避免重复)YYYYMMDDHHmmss

点击左侧「插件设置」,找到已安装的「super-prefix」,点击「设置」,点击「配置 plugin-picgo-plugin-super-prefix」:

image

3. 验证自动分类效果

上传成功后,打开 GitCode 对应的图片仓库,图片会存入 images/2025/12/22/ 文件夹:

image

进入 PicGo 主界面,上传一张测试图片(拖拽或选择文件);

image

总结

至此,「PicGo+GitCode+Typora」图床体系已全部搭建完成。通过这套方案,我们已拥有一个免费、稳定、高速的专属图床,实现了 Markdown 写作时'粘贴图片即上传'的无缝体验,彻底解决了图片跨设备同步、存储失效等痛点。

这套图床方案经过多次验证,适配 2025 年最新版本的工具与平台,且后续无需频繁维护,真正做到'一次配置,长期可用'。

目录

  1. 为什么选择这组组合
  2. 安装必备工具
  3. 1. 安装 PicGo(图片上传工具)
  4. 下载 PicGo 安装包
  5. 安装 PicGo(以 Windows 为例)
  6. 2. 安装 Node.js(PicGo 插件依赖环境)
  7. 3. 安装 Typora(Markdown 编辑器)
  8. 配置 GitCode 仓库
  9. 1. 创建 GitCode 图片仓库
  10. 2. 生成 GitCode 访问令牌(授权 PicGo 访问)
  11. 配置 PicGo 关联 GitCode
  12. 1. 安装 GitCode 上传插件
  13. 2. 配置 GitCode 图床参数
  14. 3. 测试 PicGo 图片上传功能
  15. 配置 Typora 关联 PicGo(实现自动上传)
  16. 全流程测试:从粘贴到访问的完整验证
  17. 进阶优化:super-prefix 插件实现图片自动分类
  18. 1. 安装 super-prefix 插件
  19. 2. 配置按「年 / 月」自动分类
  20. 3. 验证自动分类效果
  21. 总结
  • 💰 8折买阿里云服务器限时8折了解详情
  • Magick API 一键接入全球大模型注册送1000万token查看
  • 🤖 一键搭建Deepseek满血版了解详情
  • 一键打造专属AI 智能体了解详情
极客日志微信公众号二维码

微信扫一扫,关注极客日志

微信公众号「极客日志V2」,在微信中扫描左侧二维码关注。展示文案:极客日志V2 zeeklog

更多推荐文章

查看全部
  • DeepSeek 深度使用指南:提示词技巧与本地知识库搭建
  • YOLOv8 ROS 解决机器人视觉感知核心难题
  • AI 生图去水印的 5 种实用方法
  • 基于魔搭与 LLaMA Factory 的大模型微调全流程实战
  • Ubuntu 22.04 安装 ROS2 实战:鱼香 ROS 一键部署
  • Python 基础入门:标识符、关键字与基本语句详解
  • 数据结构与算法:链表分类详解与双向链表初始化实现
  • C++ 桌面应用 UI 技术演进与选型指南
  • Whisper v0.2 本地语音转文字工具安装与使用指南
  • 七款主流大模型英文降 AI 检测率横向测评:效果与局限分析
  • OpenClaw Linux 与 macOS 源码安装、自启动与基础配置手册
  • B 站 PC 端自动开启字幕用户脚本
  • 8 大 AI 平台速度与 Token 消耗测试
  • 论文 AIGC 检测率过高?八种优化策略与实战建议
  • RunningHub:AIGC 创作平台深度解析
  • Java OutOfMemoryError: insufficient memory 解决方案
  • 深度可分离卷积原理详解及 OPPORTUNITY 数据集实战
  • 火影忍者主题网页设计与实现
  • 堪称全网最详细的前端面试八股文,面试必备(附答案)
  • Ubuntu 20.04 安装 Ollama 及 Open WebUI 部署大型语言模型教程

相关免费在线工具

  • Base64 字符串编码/解码

    将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具,Base64 字符串编码/解码在线工具,online

  • Base64 文件转换器

    将字符串、文件或图像转换为其 Base64 表示形式。 在线工具,Base64 文件转换器在线工具,online

  • Markdown转HTML

    将 Markdown(GFM)转为 HTML 片段,浏览器内 marked 解析;与 HTML转Markdown 互为补充。 在线工具,Markdown转HTML在线工具,online

  • HTML转Markdown

    将 HTML 片段转为 GitHub Flavored Markdown,支持标题、列表、链接、代码块与表格等;浏览器内处理,可链接预填。 在线工具,HTML转Markdown在线工具,online

  • JSON 压缩

    通过删除不必要的空白来缩小和压缩JSON。 在线工具,JSON 压缩在线工具,online

  • JSON美化和格式化

    将JSON字符串修饰为友好的可读格式。 在线工具,JSON美化和格式化在线工具,online