AST Rewrite

[NiklasPor]

The formatter now uses an AST to parse & print the go template.

New features:

• else blocks are properly formatted
• inline templates like this <span {{ printf my attribute whatever }}></span> work
• if blocks auto expand

npm i prettier-plugin-go-template@0.0.11-beta.5 to try out this version.

[NiklasPor]

prettier-plugin-go-template@0.0.11-beta.6 now also supports in-line ifs & else-ifs (based on content=:

---

Input:

<img class="{{ if eq $index 1 }} 
row-span-1 {{ else }} row-span-2 {{ end }}"/>

Output:

<img class="{{ if eq $index 1 }}row-span-1{{ else }}row-span-2{{ end }}" />

---

Input:

<img class="{{ if eq $index 1 }}very long if content{{ else }}very else content{{ end }}" />

Output:

<img
  class="{{ if eq $index 1 }}
    very long if content
  {{ else }}
    very else content
  {{ end }}"
/>

[jasikpark]

It seems to have a tendency to add spaces to right before {{ end }} blocks for me 🤔

[NiklasPor]

ID Collisions are fixed in prettier-plugin-go-template@0.0.11-beta.7.

@jasikpark can you please add an input / output example?

[jasikpark]

3 Bugs 🐛 :

using prettier-plugin-go-template@0.0.11-beta.7:

A different problem is that it removed whitespace marks from blocks:

input

{{- else -}}

output

{{ else }}

And puts comments all on one line. If there's a different way to do comments in go templates, feel free to tell me though.

input:

{{/* END CSS */}}
{{/* BEGIN JS */}}

output:

{{/* END CSS */}} {{/* BEGIN JS */}}

And leaves no space between "define" blocks.

input:
https://gist.github.com/jasikpark/b8701890f83a892725ef805f377ec1ac

output:
https://gist.github.com/jasikpark/8b3f2ce38df6b29108668916f882f761

[andreseduardop]

Hello, Niklas.
Thanks for all the work you are doing improving this plugin.
I wonder if this information can help you at all... 🤔

In Sublime Text 4, build 4107
Using version prettier-plugin-go-template@0.0.11-beta.7 (and since beta-5) I get an error in the console.
(This error does not occur when returning to version @0.0.10 )

[JsPrettier DEBUG]: Found Prettier config file 'D:\Andrés\Descargas\test-project-beta-7\.prettierrc'

-----------------------------------------
 JsPrettier DEBUG - Prettier CLI Command 
-----------------------------------------

D:\Andrés\Descargas\test-project-beta-7\node_modules\.bin\prettier --config D:\Andrés\Descargas\test-project-beta-7\.prettierrc --parser html --use-tabs false --stdin-filepath D:\Andrés\Descargas\test-project-beta-7\test-file.html --loglevel debug --config-precedence file-override --cursor-offset 180

------------------
 JsPrettier ERROR 
------------------

Prettier reported the following output:

[debug] normalized argv: {"_":[],"color":true,"editorconfig":true,"use-tabs":false,"config":"D:\\Andrés\\Descargas\\test-project-beta-7\\.prettierrc","parser":"html","stdin-filepath":"D:\\Andrés\\Descargas\\test-project-beta-7\\test-file.html","loglevel":"debug","config-precedence":"file-override","cursor-offset":180,"debug-repeat":0,"ignore-path":".prettierignore","plugin":[],"plugin-search-dir":[]}
[debug] load config file from 'D:\Andrés\Descargas\test-project-beta-7\.prettierrc'
[debug] loaded options `{"parser":"go-template"}`
[debug] applied config-precedence (file-override): {"filepath":"D:\\Andrés\\Descargas\\test-project-beta-7\\test-file.html","cursorOffset":180,"parser":"go-template","useTabs":false}
[error] test-file.html: TypeError: Cannot read property 'start' of undefined
[error]     at locStart (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\parser-html.js:40:55706)
[error]     at Object.findNodeAtOffset (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\index.js:16257:17)
[error]     at coreFormat (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\index.js:16428:34)
[error]     at formatWithCursor$1 (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\index.js:16665:14)
[error]     at Object.formatWithCursor (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\index.js:60922:12)
[error]     at format$1 (D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\bin-prettier.js:16107:14)
[error]     at D:\Andrés\Descargas\test-project-beta-7\node_modules\prettier\bin-prettier.js:16139:26
[error]     at processTicksAndRejections (internal/process/task_queues.js:97:5)

Prettier process finished with exit code 2.

test-file.html:

<head>
  {{ if eq .Page.Section "card" }}
    <meta name="robots" content="noindex" />
  {{ else }}
    <meta name="robots" content="max-image-preview:large" />
  {{ end }}
</head>

Complete test project:
test-project-beta-7.zip

[NiklasPor]

@jasikpark Thanks a lot for reporting this, I'll fix both after each other and create 2 new beta releases.

[jasikpark]

Awesome! Thanks for getting this working - I might have to actually look through to see how some of this works since I’m struggling setting up https://netlifycms.org custom editor shortcodes for my hugo site 😅 it’s all regex, which isn’t quite as flexible as I think I need.

…

On June 5, 2021 at 9:15:31 AM, Niklas ***@***.******@***.***)) wrote: @jasikpark(https://github.com/jasikpark) Thanks a lot for reporting this, I'll fix both after each other and create 2 new beta resleases. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub(#49 (comment)), or unsubscribe(https://github.com/notifications/unsubscribe-auth/ACRCMJBDZKP3WND746GUNTTTRIWQHANCNFSM45NYR6XQ).

[jasikpark]

Did you see the third problem I had linked as files? Two define blocks have no newline between them, making it hard to see the break in scope.

[NiklasPor]

@jasikpark for the first two issues you can try out: 0.0.11-beta.8

If you check out feature/ast you'll see that I'm switching from the regex approach to an AST approach. This is way more flexible. But I'd suggest you to dive into it once the rewrite is finished 🥳

[NiklasPor]

prettier-plugin-go-template@0.0.11-beta.11 adds support for multiline actions 👀

---

Example:

input

<div>
<div>
{{ dict
"country" "Norway"
"population" "5 millions"
"language" "Norwegian"
"language_code" "nb"
"weather" "freezing cold"
"capitol" "Oslo"
"largest_city" "Oslo"
"currency"  "Norwegian krone"
"dialing_code" "+47"
}}
</div>
</div>

output

<div>
  <div>
    {{ dict
      "country" "Norway"
      "population" "5 millions"
      "language" "Norwegian"
      "language_code" "nb"
      "weather" "freezing cold"
      "capitol" "Oslo"
      "largest_city" "Oslo"
      "currency"  "Norwegian krone"
      "dialing_code" "+47"
    }}
  </div>
</div>

[NiklasPor]

prettier-plugin-go-template@0.0.11-beta.13 introduces an optional option to remove the bracket spacing. Defaults, of course, stay the same.

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

input

{{ test }}

output

{{test}}

[andreseduardop]

Thanks, @NiklasPor.
Now it is working properly in VS Code.

However, I don't know what I am doing wrong in Sublime Text. I always get the same error:

[error] test-file.html: RangeError: Maximum call stack size exceeded
This is all the console output:
output-console.txt

I'm using:
Prettier v2.3.1
prettier-plugin-go-template@0.0.11-beta.13 (I also tried beta 11.)
Sublime Text 4, with JsPrettier v1.38.3

[NiklasPor]

prettier-plugin-go-template@0.0.11-beta.14 fixed #52

[NiklasPor]

prettier-plugin-go-template@0.0.11-beta.15 fixes #41

[NiklasPor]

prettier-plugin-go-template@0.0.11 is now released 🚀