緣起
自己搭建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, 獲取剪貼簿圖片的程式碼抄的就是這個專案的, 讓我省了很多時間和精力 ?