• Georg Makowski
  • 0:44 am

Open files in VSCode 
from Hugo’s server preview

Two short partials create a local link to open the content file 
of the current page.

The first one renders the opening anchor tag with the VSCode link, the second one places the closing tag. The tags are generated only if Hugo runs in server mode and if a local file is present.

vscode_start.html

{{- if .Site.IsServer -}}
    {{- with .File -}}
        {{- $path := print "vscode://file" .Filename  -}}
        <a {{ printf "href=%q" $path | safeHTMLAttr }} rel="nofollow">
    {{- end -}}
{{- end -}}{{- /**/ -}}

vscode_end.html

{{ if .Site.IsServer }}
    {{- with .File }}
        </a>
    {{- end }}
{{ end }}{{- /**/ -}}

How to apply these partials

You can copy-paste these small snippets into your project, there is no need for a citation or something. The core functionality stems from VSCode.

The partials are also available as an Apache-licensed module: hugo-mod-open-in-vscode. This is the better option if you’re interested in possible updates.

The Perplex theme places them around the publishing date or — in case there is none — around the title.

See Also