VSCode内のMarkdownに画像を簡単に貼り付ける方法

2025/4/23

VSCode Markdown

VSCodeを使ってMarkdown形式で記事を書いていると画像を貼り付けたくなる場面が出てくる。その際に、画像を特定のディレクトリに移動してその相対パスを指定して、、ということをするのが面倒で調べたら、簡単にMarkdownに画像を貼り付ける方法があったため紹介

外部メディアファイルをVSCode内にペースト

Shiftを押しながらファイルをドラッグ＆ドロップでmdファイルに貼り付けることができる。普段からVSCodeで記事を書いている側からすると非常にありがたい機能。

デフォルトだと、ドラッグ&ドロップするとそのmdファイルがある階層にファイルがコピーされるが、このコピー場所はsettings.jsonで任意に設定できる。私の場合は、以下のように設定している。

{
	"markdown.copyFiles.destination": {
		"src/content/**/*": "/src/assets/"
	}
}

src/content/**/*.mdにドラッグ&ドロップして貼り付けると、src/assets配下に画像がコピーされるという設定。