写了个适用于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设置页面中填好相关的设置
⚠️需要确保配置的buck 56c et 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, 获取剪贴板图片的代码抄的就是这个项目的, 让我省了很多时间和精力 🙏
- 在vs code中使用ftp-sync插件实现客户端与服务器端代码的同步
- 在vs code中使用ftp-sync插件实现客户端与服务器端代码的同步
- 七、VsCode 的10 个必装的扩展插件
- VS Code 的常用快捷键和插件
- VSCODE 插件初探,顺便还有博主的写的背景图插件
- Golang学习日志 ━━ VSCode安装Go插件(代理的使用)及初用mod
- 【VS Code插件】让VScode中的beautify插件不格式化react项目中的jsx代码
- vscode 插件开发入门
- 16个vscode插件提升你的开发效率
- react开发vscode插件推荐
- vscode前端开发必备插件
- 软件使用-VSCode插件
- vue项目vscode常用插件
- 离线安装vscode插件
- VSCode Vue开发推荐插件和VSCode快捷键
- VSCode使用highlight-words插件设置代码高亮
- VS Code 常用插件列表
- VS扩展CodeMaid代码整理插件
- VS Code强大插件来袭!!!
- Eslint 入门与vscode常用插件