🐡

Markdownの画像をアップロードするNeoVimプラグイン

1 min read

作った

https://github.com/kyoh86/markdown-image.nvim

https://youtu.be/exWp_-QIupE

背景

https://zenn.dev/kyoh86/articles/3e894d44c8c849f58262
にも書いたけれど、ブログやらQxxtaやらここやらを渡り歩いていると、
本文はMarkdownで管理できるからともかくとしても、画像のたぐいは置き場所に困りがちだよね、という話がある。

なので、画像は自分用のなにか別のストレージに置きたいよね、ということになるわけだが、
画像をいちいちアップロードしてからURLを取得してMarkdownに埋め込んで…というのは地味にだるい。

そこで、プラグインを作ることにした。

どんなプラグイン?

2つの機能を提供する。

  • replace(deployer):
    Markdownの画像(すなわち、 ![alt-text](image-url) )の上で呼び出すと、画像のURLまたはファイルパスを取得して、これを適切なストレージに配置し直してURLを書き換える。

  • put(deployer):
    指定のレジスタから画像のURLまたはファイルパスを取得して、これを適切なストレージに配置してMarkdownの画像(すなわち、 ![](image-url) )として挿入する。

適切なストレージ、というのはdeployerを設定してやることで指定できる。
この記事公開時点では、対応しているストレージはGoogle Cloud Storage(needs gsutils)とGyazo(needs curl)のみ。

Google Cloud Storageの場合の設定例:

nnoremap <leader>r <cmd>lua require('markdown-image').replace(require('markdown-image.gcloud').new('example.com', 'gcloud-config-name', 'storage-bucket-name', 'storage-prefix'))<cr>
nnoremap <leader>p <cmd>lua require('markdown-image').put(require('markdown-image.gcloud').new('example.com', 'gcloud-config-name', 'storage-bucket-name', 'storage-prefix'))<cr>

Gyazoの場合の設定例:

nnoremap <leader>r <cmd>lua require('markdown-image').replace(require('markdown-image.gyazo').new('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'))<cr>
nnoremap <leader>p <cmd>lua require('markdown-image').put(require('markdown-image.gyazo').new('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'))<cr>

あったら良いな機能

  • ZennにアップロードするDeployer
    • アップロードするAPIが整備されたあとの話
  • DocBaseにアップロードするDeployer
  • esa.io にアップロードするDeployer
  • カーソル下じゃなくて画像全体のImageを置き換える機能