写了个适用于vscode的minio图床客户端插件 vscode-minio-picman
缘起
自己搭建minio做我的个人博客图床好一段时间了, 一直用minio自带的web管理后台来上传图片, 它的界面长下面这个样子
上传完后, 需要点下文件列表里刚刚传上去的文件的分享按钮
然后会出来下面这个界面
恩, 没错, 如果你直接复制这个链接到浏览器地址栏然后打开, 当你满心欢喜的以为能看到你刚才上传的好看的 风景/小姐姐 图片了, 结果现实只有一个白底黑子的浏览器错误报告...
内心多半是一万句"xxx"
其实要看到真正的图片倒也不难, 把http://10.244.1.134/blog/images/1.gif
里面的http://10.244.1.134
改成你自己配置的minio域名就行了, 比如 https://minio.example.com
但是这也太麻烦了, 还让不让愉快的写markdown了啊. 于是就萌生了一个写一个vscode插件来传图片到minio的想法, 因为我主要都是用vscode来编辑markdown的.
vscode-minio-picman
vscode-minio-picman
顾名思义, 适用于vscode的minio图床插件, 因为版本的顾名思义就是
A vscode plugin used to upload images to your minio server
这个插件可以让你将剪贴板或本地磁盘中图片通过上传到minio, 完后可以直接给你正确图片的链接
放一张演示gif
上传完成后, 如果你当前正在编辑的是markdown文件, 那么插件会自动帮你生成markdown格式的图片并插入到编辑器中, 像上面演示的那样
如果当前没有正在编辑的文件或者编辑的不是markdown文件的话, 则会弹出一个窗口提示你上传成功啦, 这个弹窗上有一些按钮, 允许你复制此图片不同格式的链接, 如下图
终于不用像之前那样蠢呼呼的在minio自带控制台里点分享按钮在替换域名那样麻烦了. 又可以愉快的markdown了! 👏
vscode-minio 使用前
使用前需要你有一个minio文件服务器, 然后在vscode设置页面中填好相关的设置
⚠️需要确保配置的bucket name在minio中已经创建好了的, 否则无法上传成功
vscode-minio 快捷键
插件默认:
ctrl/cmd+shift+x
上传剪贴板图片ctrl/cmd+shift+z
从本地选择一张图片上传
也可以自己到vscode相关的设置页面自定义这两个命名的快捷键(键盘按下cmd+shift+p
然后搜索Keyboard shortcuts
)
vscode-minio 仓库地址
vscode-minio-picman, 欢迎围观吐槽或pr
为什么不用picgo
看了下picgo是好像需要通过插件支持minio, picgo的vscode的插件好像暂时还不支持picgo插件系统.
不过很感谢vscode-picgo, 获取剪贴板图片的代码抄的就是这个项目的, 让我省了很多时间和精力 🙏