VS Codeでスニペットを使う

経緯

HugoにContent adaptersを導入したら、ターミナル.appで hugo new したときのファイルの中身がarchetypesを反映しなくなった

Claudeに相談したら、以下を提案された

1. シェルスクリプトを作っておいて実行する

2. VS Codeでスニペットを登録しておいて呼び出す

3. 日時を date +"%Y-%m-%dT%H:%M:%S+09:00" で表示させてコピペする

自サイト関連の作業はVS Codeを使うので、2を採用

/icons/hr.icon

Claude.icon

では手順を説明します 😊

1. スニペットファイルを開く

VSCodeで Cmd + Shift + P を押して、snippets と入力。「スニペット: ユーザースニペットの構成」を選択してください。

2. markdown.json を選ぶ

一覧の中から markdown と入力して markdown.json を選択してください。

3. 以下を貼り付ける

code:markdown.json

json{

"Hugo Front Matter": {

"prefix": "fm",

"body": [

"---",

"title: \"$1\"",

"date: $CURRENT_YEAR-$CURRENT_MONTH-${CURRENT_DATE}T$CURRENT_HOUR:$CURRENT_MINUTE:$CURRENT_SECOND+09:00",

"draft: true",

"---",

"",

"$0"

"description": "Hugo front matter"

}

使い方

Markdownファイルを開いて fm と入力すると候補が出るので選ぶだけです。その時点の日時が自動で入ります 🙂

ただ、VSCodeのスニペットはデフォルトだとMarkdownファイルで補完候補が出ないことがあります。もし fm と打っても何も出なかったら教えてください！

/icons/hr.icon

yuyuko.icon

手順どおりにやってfmと打ってみましたが、何も出ませんでした……😭

/icons/hr.icon

Claude.icon

やっぱりそうでしたか😅 設定を1つ追加すれば出るようになります！

1. settings.json を開く

Cmd + Shift + P → settings json と入力 → 「基本設定: ユーザー設定を開く(JSON)」を選択。

2. 以下の1行を追加する

code:json

json"markdown": {

"editor.quickSuggestions": {

"other": "on"

}

既存の { の中に追加する形です。たとえばすでに何か書いてある場合はこんな感じになります：

code:json

json{

"editor.fontSize": 14,

"markdown": {

"editor.quickSuggestions": {

"other": "on"

}

保存したら fm と打ってみてください 🙂

/icons/hr.icon

yuyuko.icon

できました💕 ありがとう！！

/icons/hr.icon

Claude.icon

よかったです！💕

これで新しいファイルを作るときの日時入力がぐっと楽になりますね 😊 またいつでも相談してください！