マークダウンで画像のコピペ – VSCode + Paste Image

僕は最近ほぼすべての文章をマークダウンで書いてます。
エクセルやワードも嫌いです。だって変更時の差分が見づらいから。
しかし、マークダウンで書いてるとどうしても画像の貼り付けが面倒です。
そこで登場するのがPaste Image。
もう手放せません。

解決される課題

マークダウンでイメージを表示する書式を書くのが面倒。
画像をフォルダに保存した上でこんな感じに書きます。

![イメージの説明](イメージのパス)

やっぱコピペしたい。

解決策

Visual Studio Code の拡張機能 Paste Imageを入れる。
あぁ・・・楽。

詳細手順

1. Ctrl + Shift + X で拡張機能のマーケットプレイスを開く
2. Paste Imageを検索してInstall

使い方

そのまま貼り付ける

画面を適当にキャプチャして、Ctrl + Alt + V.
ショートカットとファイル名は微妙。
Window10の標準機能なので蛇足ですが、Windowキー + Shift + Sで画面の一部をキャプチャしています。

ファイル名が微妙です。

名前を付けて貼り付ける

貼り付けるところに先にファイル名を書いておきます。
それからCtrl + Alt + V.

先にファイル名を書いておかないといけないのでオペレーションが微妙です。

イメージの保存先を指定しておきたい

ファイル→ユーザー設定→設定

Paste Image: Path
こんな感じで書く。後は貼り付け。
フォルダが無くても作ってくれます。

${currentFileDir}\img

ファイル名とフォルダ名を一致させたい場合

${currentFileDir}\${currentFileName}img

特に意味はありませんが3階層下っても勝手に作ってくれました。

${currentFileDir}\img

現段階では、パスにバックスラッシュ"\"を指定しても貼り付け結果がスラッシュになってしまいます。実害は無いのですが微妙に気持ち悪い。(2020/08/08現在)
英語が苦手なので、伝わるかわかりませんがissue投げておきました。

ファイル名に接頭辞をつけたい

ファイル→ユーザー設定→設定

Paste Image:Name Prefixを探します。
任意の値を設定します。

貼り付けたらファイル名の先頭に設定した値が入ります。
画像の例ではIMG-

[![](https://www.premium-tsubu-hero.net/wp-content/uploads/2020/08/IMG-2020-08-08-06-57-32.png)](https://www.premium-tsubu-hero.net/wp-content/uploads/2020/08/IMG-2020-08-08-06-57-32.png)

ファイル名に接尾辞をつけたい

ファイル→ユーザー設定→設定

Paste Image:Name Suffixを探します。
任意の値を設定します。

貼り付けたらファイル名のファイル名の最後に設定した値が入ります。
画像の例では-IMG

![](2020-08-08-06-57-32-IMG.png)

まとめ

かなりシンプルですけど、一番使う拡張機能かもしれません。
便利。

おわり

---

VSCodeの使い方はこの辺にまとめています。
よろしければどうぞ。→ Visual Studio Code