CODEWITHSUNDEEP
visual-studio-codeyamlkubernetes-helm
user906573
user906573

Reputation: 733

vs code formats yaml file with extra spaces between brackets

I use vscode as an editor and have several yaml files in the project where parameter replacement occurs. However, it re-formats only one file with extra spaces between brackets, a file named service.yaml used by helm in our ci/cd pipeline. See below for before and after. enter image description here

and after enter image description here

I was wondering if the name of the file has particular significance for vscode or any other extensions... Thanks.

Upvotes: 9

Views: 8517

Answers (4)

neocoder
neocoder

Reputation: 101

If the prettier is used in the project, you can add this to .prettierrc

{
    ...
    "overrides": [
        {
            "files": ["*.yaml", "*.yml"],
            "options": {
                "bracketSpacing": false
            }
        }
    ],
    ...
}

Upvotes: 3

trescube
trescube

Reputation: 1

TL;DR - Just add all of your helm .yaml files to .prettierignore since they contain go text templates and are not supposed to be valid YAML anyway.

The Full Explanation

I was encountering the same issue with prettier and did some investigating. The actual answer is that the helm-generated service.yaml file looks like actual YAML where everything enclosed in {{...}} is interpreted to be a value. When prettier runs on service.yaml, it just formats the file contents according to the prettier settings with the prettier console displaying a successful prettier run:

["INFO" - 10:37:59 PM] Formatting completed in 20ms.

This leaves the file in a bad state since { { .Values.service.port } } is not a valid go template and therefore cannot be rendered by helm.

However, all of the other helm-generated .yaml files have some go templates for text rendering in places that are not intended to be valid YAML syntax. For example, my serviceaccount.yaml file starts with:

{{- if .Values.serviceAccount.create -}}
apiVersion: v1
kind: ServiceAccount
metadata:
...

Note that this is not valid YAML syntax, so prettier throws an error, outputing something like this in the prettier console:

["ERROR" - 10:21:24 PM] Error formatting document.
["ERROR" - 10:21:24 PM] Document contains trailing content not separated by a ... or --- line (2:1)
   1 | {{- if .Values.serviceAccount.create -}}
>  2 | apiVersion: v1
     | ^^^^^^^^^^^^^^
>  3 | kind: ServiceAccount
     | ^^^^^^^^^^^^^^^^^^^^
>  4 | metadata:
     | ^^^^^^^^^^^^^^^^^^^^
...<a whole lot of other errors followed by a stack trace>
["INFO" - 10:21:24 PM] Formatting completed in 21ms.

(Okay, okay, technically the first line actually is valid YAML document but to follow with apiVersion: v1 on the next line would require a new document delimiter in the stream using either ... or --- line between, which would break helm anyway)

Since prettier can't successfully format the file as YAML, it just leaves the file as-is.

As the helm templates are not intended to be pure YAML, the solution is most likely just to add all of those files to .prettierignore and move on with life.

Upvotes: -1

Aarkon
Aarkon

Reputation: 488

Uncheck Bracket Spacing in Extensions/YAML.

enter image description here

Edit: There is a caveat. This will format {{ foo }} or { { foo } } to {{foo}}, which is not necessarily syntactically correct in terms of Jinja templating.

Upvotes: 9

chuve
chuve

Reputation: 728

One of the way how to resolve this issue - wrap values into the quotes.

Like this:

app: "{{ .Values.name }}"

Probably not the best solution, but it works for me.

Upvotes: 3

Related Questions