Visual Studio Code 拡張 VSNotes でメモをとる

Posts Published: 2019年5月28日

Visual Studio Code

Visual Studio Code のメモ帳用拡張機能である VSNotes が便利です。

VSNotes を使うと便利になること

左メニューに常時「VS Notes」のアイコンが表示され、メモへすぐにアクセスできる。
タグを打つことができ、タグ検索ができる。
ファイル名の付け方ルールを設定できる。
VSCode Snipet を使うと、テンプレートを利用してファイルを作成できる。

必要なもの

Visual Studio Code

初期設定

VSNotes のインストール

Visual Studio Code で拡張機能のメニューを開きます。
検索窓に「VSNotes」と検索して、VSNotes をインストールします。

メモの保存先の設定

Shift + Ctr(Command) + P でコマンドパレットを開き、「vsnotes run」と入力します。
「VSNotes: Run setup」が補完されるので、Enter キーで確定します。右下にダイアログが表示されます。
[start] ボタンをクリックします。ファイルダイアログが表示されます。
メモファイルを保存したいルートディレクトリを指定します。Dropbox などのネットワークディレクトリも設定できます。
VS Code を再起動します。左メニューに VSNote のアイコンが表示されます。
アイコンを選択すると VSNotes のエクスプローラが表示されます。 VSNotes を使ってメモを作成すると、先ほど指定したディレクトリにファイルが保存され、VSNotes のエクスプローラにファイルがツリー表示されます。

VSNotes の使い方

Shift + Ctr(Command) + P でコマンドパレットを開き、「vsnote create」と入力します。
「VSNotes: Creat a New Note」と補完されるので、Enter キーで確定します。
ファイル名の入力を求められるので入力します。ファイル拡張子は不要です。
初期状態では、次の内容でメモファイルが作成されます。ファイル名は yyyy-MM-dd_HH-mm_3.でつけた名前.md です。
```
---
tags:
  -
---
```
tag の部分に * タグ名 を指定すると、VSNotes のエクスプローラにタグが表示され、同じタグがついたファイルにアクセスできます。反映されないときは更新マークをクリックします。
```
---
tags:
  - meeting-notes
---

# レベル1
## レベル2
Markdown 形式で書く
```

設定変更

デフォルトのファイル名の変更

ファイル名のデフォルトは、yyyy-MM-dd_HH-mm_パレットで指定した名前.md です。これを yyyy-MM-dd パレットで指定した名前.mdに変更します。

手順

Shift + Ctr(Command) + P でコマンドパレットを開き、「setting」と入力します。「Preferences: Open User Settings」と補完されるので、Enter キーで確定します。
設定右上の「{}」マークをクリックし、setting.json を開きます。
次の内容を追記して、保存します。

"vsnotes.noteTitleConvertSpaces": " ",
"vsnotes.defaultNoteTitle": "{dt} {title}.{ext}",
"vsnotes.tokens": [
  {
    "type": "datetime",
    "token": "{dt}",
    "format": "YYYY-MM-DD",
    "description": "Insert formatted datetime."
  },
  {
    "type": "title",
    "token": "{title}",
    "description": "Insert note title from input box.",
    "format": "Untitled"
  },
  {
    "type": "extension",
    "token": "{ext}",
    "description": "Insert file extension.",
    "format": "md"
  }
],

これで、コマンドパレットから「VSNotes: Creat a New Note」したときに生成されるファイル名が yyyy-MM-dd パレットで指定した名前.mdになります。

ファイルのテンプレートの変更

ファイルを生成したときのテンプレートを作成します。今回、議事録テンプレートとして、次の内容のテンプレートを作成します。

---
tags:
  * meeting-notes
---

# yyyy-MM-dd パレットで指定した名前
##

手順

[Code]> [基本設定] > [ユーザースニペット] を選択します。
検索窓に [Markdown] と入力します。markdown.json [Markdown] と補完されるので、Enter キーで確定します。

{ ... } 内に、次の内容を追記して保存します。

"vsnote_template_mtg": {
  "prefix": "vsnote_template_mtg",
  "body": [
    "---",
    "tags:",
    "\t* meeting-notes",
    "---",
    "\n# $TM_FILENAME_BASE\n",
    "$1",
  ],
  "description": "Meeting Template",
}

テンプレート名にあたるキーは vsnote_template_ から始まる必要があります（2019/09/25 追記）

Shift + Ctr(Command) + P でコマンドパレットを開き、「setting」と入力します。「Preferences: Open User Settings」と補完されるので、Enter キーで確定します。
設定右上の「{}」マークをクリックし、setting.json を開きます。
次の内容を追記し、保存します。

  "vsnotes.templates": [
    "mtg",
  ],

動作確認

コマンドパレットから「VSNotes: Creat a New Note」したとき「mtg」が一覧から選べます。選択して Enter キーで確定します。あとはファイル名を入力すると、スニペットに指定したテンプレートでファイルが作成されます。

補足

datetime の formatの書式は、Moment.js のフォーマットに従います。
markdown.jsonは VSCode の snippet 機能です。使える変数はCreating your own snippets * Variables を参照のこと。
同じように markdown.json にスニペットを定義して settings.json の vsnotes.templates に指定すれば複数のテンプレート登録が可能です。