Formatter removes all indentations

[tk-90-github]

I like the syntax highlighting and formatting much EXCEPT:

When i indent my blocks and conditional statements, all the identation is removed.

Disabling this plugin solved it but that's not what I like to do.

Can you provide me a solution/some settings.json-config for VSCode or get a fix for it?

[RyanBaig]

its probably because html formatter and such dont know what to do with jinja template tags, and just write them like plaintext. Please also let me know if u find a formatter that works with this extension,

[samuelcolvin]

There's no solution I know of for this.

[Rawk]

I finally found a solution that seems to work for me.

Use the VS Code extension Prettier for nice HTML formatting, with the Prettier plugin prettier-plugin-jinja-template to make Prettier aware of Jinja syntax.

There is multiple ways to set it up. Since i already used npm, i added it with:

npm install --dev --save-exact prettier prettier-plugin-jinja-template

This forces the Prettier extension to use the Prettier version inside node_modules/prettier.

Add Prettier config to package.json making it look something like this:

{
  "devDependencies": {
    "prettier": "3.3.3",
    "prettier-plugin-jinja-template": "2.0.0"
  },
  "prettier": {
    "plugins": ["prettier-plugin-jinja-template"]
  }
}

Set Prettier as default formatter for jinja-html in VS Code settings:

{
  "[jinja-html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
}