「2024-06-05」のような日付をVSCodeで簡単に入力する方法

静的サイトジェネレータを使ってWebサイトを作る場合、記事のフロントマターに日付を入力したい場合がある。例えばZolaの場合は

+++
date="2024-06-05"
+++
# 本文
...

といった感じに入力することで記事の作成日を指定できる。この日付をVSCodeで簡単に入力することができないか調べた。

Edit with Shell Command機能拡張

導入後、WSLの導入されたWindowsでは次のようにsettings.jsonに設定して

"editWithShell.shell.windows": "wsl",
"editWithShell.shellArgs.windows": [
    "bash",
    "-c"
]

EditWithShell: Runコマンドで

echo -n `date +%Y-%m-%d`

を実行すればカーソルの位置に日付をYYYY-MM-DD形式で挿入できる。なお、dateコマンドだけだと改行が最後に挿入されてしまうのでecho -nで改行を除いている。

このケースに限らず、VSCodeでエディタ部の任意のテキストを選択して、その内容Linuxのコマンドで加工することができるのでuniqで重複を除いたりsortでソートしたりできる。

VSCodeのスニペット

Edit with Shell Commandのように既存の文字を置き換えたりはできないが、VSCodeの標準のスニペット機能で現在の日付の文字列を出力する方法がわかった。

すでに文字のある行にキャレットの位置があるスニペットが入力候補に出なかったり、新規に文字を作成するだけで選択した文字を置き換えることができなかったり、よくわからない制限事項が多いのであまり使っていなかったが単純な定型文を入力したい場合にはよさそうだ。

{
	"current date YYYY-MM-DD":{
		"prefix": "date",
		"body": "$CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE"
	},
}