Gitee+PicGo 搭建 Markdown 笔记图床方案

Gitee+PicGo 搭建 Markdown 笔记图床方案 | 极客日志

引言：为什么要解决搭建图床？

你是否遇到过这样的场景：

用 Obsidian 写了半年的知识库，换电脑时发现所有图片都变成'破碎图标'；
把 Markdown 笔记分享给同事，对方打开后图片全是本地路径，根本看不到内容；
尝试用云盘链接替代，却因为'防盗链'或'链接过期'，图片还是无法正常显示……

本地 Markdown 笔记的'图片依赖本地路径'，是困扰无数创作者的痛点。而解决这个问题的核心，就是搭建一个'图床'——把图片托管到云端，让链接永远有效。

本文将带你用'Gitee（国内免费仓库）+ PicGo（自动上传工具）+ Node.js（运行环境）'搭建图床，不仅解决'图片失效'，还能实现：

✔️ 国内访问快：Gitee 服务器在国内，无需科学上网，图片秒加载；
✔️ 完全免费：Gitee 仓库、PicGo、Node.js 均为开源免费工具；
✔️ 无缝对接 Obsidian：写笔记时'拖入图片自动上传'，全程无感知；

从工具原理解析到 Step by Step 实操（包括环境搭建、插件配置、异常排查），甚至帮你避过 90% 的踩坑点。无论你是笔记爱好者，还是专业创作者，都能通过这篇文章彻底解决'图片链接失效'的心病。

下文将从概念扫盲开始，逐步拆解每一步配置，确保'0 基础也能跟做'。

一、概念扫盲：为什么需要这些工具？

在开始操作前，先搞懂四个核心概念，避免'盲目操作'：

1. 图床：图片的'云端仓库'

定义：专门用来存储图片的云端平台，核心是生成'永久可访问的图片 URL'（如 https://gitee.com/xxx.png）。
类比：把图片当成'货物'，图床就是'网络仓库'，随时能通过链接提取货物（图片）。
解决的痛：
- 本地笔记里的 ![示例](./images/pic.png)，换电脑、分享给别人时，链接必然失效；
- 图床的链接是'云端地址'，在哪台设备打开都能访问，彻底摆脱'路径依赖'。

2. Gitee：国内版'代码托管平台'（选它当图床的理由）

定义：类似 GitHub，但服务器在国内，是免费的代码/文件托管平台，可以理解为'中国的 GitHub'。
为什么选 Gitee 当图床？
- ✅ 访问快：国内节点，不用科学上网，图片加载秒开；
- ✅ 免费开源：创建'开源仓库'后，图片可被公开访问（非开源仓库的图片无法外链）；
- ✅ 支持 RAW 链接：仓库里的图片能通过 https://gitee.com/用户名/仓库名/raw/分支/图片路径.png 直接访问（类似 GitHub 的 RAW 链接，但速度更快）。
对比其他云盘：百度网盘的链接带防盗链，无法直接插入 Markdown；而 Gitee 的 RAW 链接是'纯静态文件地址'，完美适配 Markdown 语法。

3. PicGo：图片上传'自动化神器'

定义：图片上传客户端，核心是'一键上传本地图片，自动生成网络链接'。
核心价值：把'登录 Gitee→找仓库→点击上传→复制链接'的繁琐步骤，压缩成'拖入图片→自动出链接'（甚至支持快捷键 Ctrl+Alt+U）。
为什么需要插件？ PicGo 默认支持 GitHub、七牛云等图床，但不直接支持 Gitee。这时需要安装 gitee-uploader 插件（用 Node.js 开发），让 PicGo 能对接 Gitee。

4. Node.js：插件的'动力引擎'

定义：让 JavaScript 代码能在电脑本地运行的运行时环境（类似 Java 的 JVM，Python 的解释器）。
在图床场景里的作用： PicGo 的插件（如 gitee-uploader）是用 Node.js 开发的，必须安装 Node.js 才能运行这些插件。简单说：Node.js 是'插件的发动机'，没有它，PicGo 无法加载 Gitee 插件。

二、环境搭建：Node.js 安装（必做！）

3.1 下载 Node.js

访问 Node.js 官网，选择 LTS 长期支持版（如 18.18.0 LTS）：

Windows 用户选 x64 Installer（64 位系统通用）；
macOS 选 .pkg 安装包；
Linux 通过包管理器安装（如 sudo apt install nodejs）。

3.2 安装与验证（以 Windows 为例）

双击安装包，勾选'Add to PATH'（自动配置环境变量，避免手动设置）；
一路点击'Next'，默认路径安装即可；

打开命令提示符（CMD），输入以下命令验证：

node -v
npm -v

输出 Node 版本（如 v18.18.0）和 npm 版本（如 9.8.1）。若正常输出版本，说明安装成功。

三、PicGo 安装：图片上传客户端

4.1 下载对应版本

访问 PicGo 官网或国内镜像，根据系统选择：

Windows：优先选 PicGo-Setup-xxx-x64.exe（64 位系统专属，性能更优）；
macOS：选 PicGo-xxx.dmg；
Linux：选 PicGo-xxx.AppImage。

Windows 一般建议选 2.4 的版本都是可以的，不要选 2.3 之前的老版本就行，因为老版本还不支持 gitee 插件。

注意这里可能会有一个小插曲——程序被报错不安全，这里直接选保留就行了。

4.2 安装与启动

双击安装包，按向导完成安装；

启动 PicGo 后，右下角托盘会出现图标，右键→'打开主界面'即可操作。

四、Gitee 配置：创建图片仓库

5.1 新建 Gitee 仓库

填写关键信息：
- 仓库名称：建议含 img 或者 picture；
- 可见性：必须选'开源'（否则图片无法公开访问）；
点击'创建'。

初始化仓库：勾选（自动生成 README，便于管理）；

5.2 获取访问令牌（Token）

点击 Gitee 头像→'设置'→'私人令牌'→'生成新令牌'；

配置令牌：
- 描述：填 PicGo 图床（方便记忆）；
- 权限：仅勾选'projects'（最小必要权限，避免安全风险）；

提交后，复制生成的 Token（仅显示一次，务必保存到记事本！）。

五、PicGo 配置：连接 Gitee 图床

6.1 安装 Gitee 插件

打开 PicGo 主界面→左下角'插件设置'；

命令行手动安装：

npm install picgo-plugin-gitee-uploader -g

先换国内 npm 源（加速下载）：

npm config set registry https://registry.npmmirror.com

搜索框输入 gitee，找到 gitee-uploader 1.1.2 插件，点击'安装'。

⚠️ 若安装失败：请检查 Node.js 环境是否配置正确。

6.2 配置 Gitee 图床参数

点击'设为默认图床'→'确定'，完成配置。

填写关键参数（参考示例）：

参数	填写规则	示例
repo	`用户名/仓库名`（从 Gitee 仓库 URL 提取）	`your_gitee_name/note-img-bed`
branch	仓库分支（可不写，默认 `main` 或 `master`）	`master`
token	刚才复制的 Gitee Token	`xxxxxxxxxxxxx`
path	图片存储路径（与仓库 `img` 文件夹一致）	`img/`
customPath	按日期分类（可选，如`${year}/${month}/${day}`）	`2025/09/16`（自动生成）

回到 PicGo 主界面→'图床设置'→选择'Gitee'。

六、Obsidian 集成：让本地图片自动上传

7.1 安装图片上传插件

搜索 Image Auto Upload，点击'安装'→'启用'。

打开 Obsidian→'设置'→'社区插件'→'浏览'。

7.2 配置 PicGo 服务

在 Obsidian 插件设置中，找到'Image Auto Upload'：

端口：默认 36677, 上传接口默认为 http://127.0.0.1:36677/upload

若被占用，可在 PicGo→'设置'→'设置 Server'中修改。

7.3 测试上传（关键步骤！）

在 Obsidian 中插入本地图片（拖入编辑区，或用 ![[pic.png]] 语法）；
查看图片链接：已自动替换为 Gitee 的网络链接（如 https://gitee.com/xxx/xxx.png）；

验证：复制链接到浏览器，若能正常显示图片，则配置成功。

七、常见问题排查

8.1 PicGo 上传失败

❌ Node.js 未安装：重新运行 node -v 验证，若未安装则回到步骤三。
❌ 仓库路径错误：检查 repo 是否为 用户名/仓库名，path 是否与仓库 img 文件夹一致；
❌ Token 权限不足：重新生成 Token，确保勾选 projects 权限；

8.2 Gitee 图片无法访问

❌ 路径错误：检查 PicGo 配置的 path 和仓库实际文件夹是否一致（如 img/ 是否存在）。
❌ 仓库未开源：进入 Gitee 仓库→'管理'→'基本信息'→设为'开源'；

8.3 Obsidian 上传无反应

❌ 端口冲突：修改 PicGo 的 Server 端口（如 36678），并同步更新 Obsidian 插件配置。
❌ PicGo 未启动：确保 PicGo 在后台运行（托盘有图标）；

八、总结：从本地到云端的跨越

通过 Gitee（存储）+ PicGo（上传）+ Node.js（环境）的组合，我们实现了：

✅ 本地图片自动转网络链接，跨设备、跨平台访问稳定；
✅ 借助 Gitee 国内节点，访问速度优于 GitHub；
✅ 配合 Obsidian 插件，写作时'无感上传'，专注内容创作。

附录：工具速链

Node.js 下载：https://nodejs.org/
PicGo 官网：https://molunerfinn.com/PicGo/
Gitee 官网：https://gitee.com/

Gitee+PicGo 搭建 Markdown 笔记图床方案

引言：为什么要解决搭建图床？

一、概念扫盲：为什么需要这些工具？

1. 图床：图片的'云端仓库'

2. Gitee：国内版'代码托管平台'（选它当图床的理由）

3. PicGo：图片上传'自动化神器'

4. Node.js：插件的'动力引擎'

二、环境搭建：Node.js 安装（必做！）

3.1 下载 Node.js

3.2 安装与验证（以 Windows 为例）

三、PicGo 安装：图片上传客户端

4.1 下载对应版本

4.2 安装与启动

四、Gitee 配置：创建图片仓库

5.1 新建 Gitee 仓库

5.2 获取访问令牌（Token）

五、PicGo 配置：连接 Gitee 图床

6.1 安装 Gitee 插件

6.2 配置 Gitee 图床参数

六、Obsidian 集成：让本地图片自动上传

7.1 安装图片上传插件

7.2 配置 PicGo 服务

7.3 测试上传（关键步骤！）

七、常见问题排查

8.1 PicGo 上传失败

8.2 Gitee 图片无法访问

8.3 Obsidian 上传无反应

八、总结：从本地到云端的跨越

更多推荐文章

相关免费在线工具

Gitee+PicGo 搭建 Markdown 笔记图床方案

引言：为什么要解决搭建图床？

一、概念扫盲：为什么需要这些工具？

1. 图床：图片的'云端仓库'

2. Gitee：国内版'代码托管平台'（选它当图床的理由）

3. PicGo：图片上传'自动化神器'

4. Node.js：插件的'动力引擎'

二、环境搭建：Node.js 安装（必做！）

3.1 下载 Node.js

3.2 安装与验证（以 Windows 为例）

三、PicGo 安装：图片上传客户端

4.1 下载对应版本

4.2 安装与启动

四、Gitee 配置：创建图片仓库

5.1 新建 Gitee 仓库

5.2 获取访问令牌（Token）

五、PicGo 配置：连接 Gitee 图床

6.1 安装 Gitee 插件

6.2 配置 Gitee 图床参数

六、Obsidian 集成：让本地图片自动上传

7.1 安装图片上传插件

7.2 配置 PicGo 服务

7.3 测试上传（关键步骤！）

七、常见问题排查

8.1 PicGo 上传失败

8.2 Gitee 图片无法访问

8.3 Obsidian 上传无反应

八、总结：从本地到云端的跨越

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

更多推荐文章

相关免费在线工具