Prettier-plugin-go-template NPM

prettier-plugin-go-template

Formatter plugin for go template files. The only peer dependency is prettier.

npm install --save-dev prettier prettier-plugin-go-template

Starting with Prettier 3 auto-discovery has been removed. Configuration is required ⬇️

// .prettierrc
{
  "plugins": ["prettier-plugin-go-template"]
}

The following file types will be detected automatically: .gohtml, .gotmpl, .go.tmpl, .tmpl, .tpl, .html.tmpl If you want to add support for .html read the section on it below the examples.

{{ if or .Prev .Next -}}
{{ $p := where site.Pages }}
<div class="my-navigation">
{{ with $p.Next . -}}
<a href="{{ .RelPermalink }}">
<div class="row">
<div class="cell py-2">
  {{ .Title }} 
</div> </div> </a>
{{ end -}}
</div>
{{ end -}}

{{ if or .Prev .Next -}}
  {{ $p := where site.Pages }}
  <div class="my-navigation">
    {{ with $p.Next . -}}
      <a href="{{ .RelPermalink }}">
        <div class="row">
          <div class="cell py-2">{{ .Title }}</div>
        </div>
      </a>
    {{ end -}}
  </div>
{{ end -}}

GoHugo / `.html`

To use it with GoHugo and basic .html files, you'll have to override the used parser inside your .prettierrc file:

{
  "plugins": ["prettier-plugin-go-template"]
  "overrides": [
    {
      "files": ["*.html"],
      "options": {
        "parser": "go-template",
      },
    },
  ],
}

VSCode

Make sure to always have installed both dependencies:

prettier
prettier-plugin-go-template

Also make sure that they are installed inside the same scope. Install both globally (npm i -g) or locally – otherwise prettier may not pick up the plugin.

Note: The global setup additional requires setting your VSCode prettier path to your global prettier path. You can read in this issue how to set it up – should be doable in less than a minute if you have npm & VSCode already running.

Additional Options

// .prettierrc
{
  /**
   * Enables & disables spacing between go statements.
   * E.g. {{ statement }} vs {{statement}}.
   * Default: true
   */
  "goTemplateBracketSpacing": true
}

Ignoring Code

Single Block

<div>
  <!-- prettier-ignore -->
  {{if }}
  {{end }}
</div>

Multiline

<html>
  {{/* prettier-ignore-start */}}
  <script>
    {{if }}
    Whatever.
    {{else }}
    Psych.
    {{end }}
  </script>
  {{/* prettier-ignore-end */}}
</html>