HugoServer動作MarkdownVSCode開くリンク表示する

こんにちはnasustです。 Hugoでウェブサイトを運営しているとMarkdownが増えて行きます。 過去の記事を編集する時にMarkdownを探すのに時間が掛かります。

そこでアプリのディープリンクという機能を使用して、 Hugo Server動作時にMarkdownを直接開けるリンクを表示します。

アプリのディープリンクとはウェブページのリンクからアプリに移動する機能の事です。

MarkdownをVS Codeで開く場合は以下のページで説明されているvscode://file/{full path to file}というURLスキームを使用します。

The Visual Studio Code command-line options

これをHugo Serverの時だけリンクを表示します。

テンプレート例

{{ if .Site.IsServer }}
    <div class="m_open-markdown" >
        {{ emojify ":star:" }} Hugo {{ hugo.Version }} : Server Mode
        {{ if .Page.IsPage }}
            : {{ emojify ":memo:" }} Edit: <a class="m_open-markdown_link"
            href="vscode://file/{{ .File.Filename }}">{{ .File.Path }}</a>
        {{ end }}
    </div>
{{ end }}
html

表示例

Hugo Server動作時にVS CodeでMarkdownを開くリンクを表示します。

クリックするとVS Codeで開くか確認するダイアログが表示されます。 開くとVS Codeで開きます。

prevnext