vscode+picgo+gitee实现Markdown图床

vscode中编辑Markdown文件,复制的图片默认是保存在本地的。当文档上传csdn时,会提示图片无法识别

可以在gitee上创建图床仓库,使用picgo工具上传图片,在Markdown中插入gitee链接的方式来解决该问题。

一、 安装picgo工具

1.1 vscode安装picgo插件

1.2 安装picgo

进入PicGo官网: PicGo官网

点击免费下载按钮

建议安装正式版,下载安装文件。

正常安装完成后,打开软件,点击"插件设置",搜索gitee,安装"gitee-uploader"插件。如安装发生错误,提示安装Node.js, 需先安装好node.js。

完成Node.js 安装后,重启picgo继续安装插件,完成插件安装

二、gitee图床

可以在gitee上新建一个仓库,作为图床。也可使用已创建的git开源仓库。如下展示新建仓库的方法。

确认仓库创建成功

三、picgo配置

3.1 picgo 配置

在"图床设置"下找到"gitee",进行如下配置

  • repo: 仓库名称
  • branch: 提交分支,可写master
  • token: gitee的私人令牌
  • path: 仓库下的存放路径
  • customPath、customUrl: 无需填写

3.2 gitee token获取

点击设置

点击私人令牌,生成新令牌

配置令牌权限

生成的私人令牌保存好,并将token配置到picgo中

四、图床功能验证

4.1 截图上传

使用截图工具截图并复制后,在vscode中按快捷键Ctrl+Shift+P, 待右下角提示上传成功后,可以使用Ctrl+V把图床链接粘贴到Markdown文档中

4.2 picgo客户端拖拽上传

4.3 gitee仓库查看

查看gitee仓库,确认图片正确上传。此外,还可以更改picgo

五、结语

至此,在vscode中编辑的Markdown文档中的图片可以先上传到图床,再在文档中插入链接,这样上传文档就不会出现图片上传失败的问题。

五、结语

至此,在vscode中编辑的Markdown文档中的图片可以先上传到图床,再在文档中插入链接,这样上传文档就不会出现图片上传失败的问题。

相关推荐
changuncle19 分钟前
VSCode使用ipynb文件高效地进行功能测试
vscode·功能测试·jupyter·ipynb·方便
syluxhch21 分钟前
Pycharm的终端(Terminal)中切换到当前项目所在的虚拟环境
ide·python·pycharm
EEer!3 小时前
vscode(七):设置不同括号有不同颜色
ide·vscode·编辑器
花生君6 小时前
如何在Android Studio中查看APP客户端日志
android·ide·android studio
森叶13 小时前
webstorm 高效查看不同分支差异 摒弃你的git diff手动操作
ide·git·webstorm
GeniusAng丶19 小时前
vscode刷LeetCode算法题环境配置
vscode·算法·leetcode
moxiao199507131020 小时前
PyCharm社区版Cython支持
ide·python·pycharm
couldn20 小时前
yaklang window安装 vscode运行得到“hello world”
ide·vscode·网络安全·编辑器·密码学·密钥·yaklang
cv操作贼620 小时前
vscode 快捷键
ide·vscode·编辑器
东皇太一在此20 小时前
VScode使用ssh连接服务器
服务器·vscode·ssh