.ejs formatting in VSCode

Question

This is my problem - its unreadable

In order to get .ejs working in general, I've so far added the following. I also have format on save and prettier. I'm looking for proposals to get better formatting of this so that I can read it.

"files.associations": {
    "*.ejs": "html",
    "*.css": "postcss"
},
"emmet.includeLanguages": {
    "postcss": "css",
    "ejs": "html"
},
"emmet.syntaxProfiles": {
    "postcss": "css",
    "ejs": "html"
}

Answer 1

I know that's an old question, but working with .ejs in VSCode is still a problem. But I found the solution (for ? delimeter)

1. Install EJS language support plugin
2. Now you have ejs support, highlighting, and snippets, but some tags like

<? for( let item of array ) { ?>
(some data)
<? } ?>

are formatted incorrectly (at least with default html formatter).

3. To fix this, you can try set custom delimeter to '?' ejs.delimeter = '?'. Now you have correct indentation with <? ... ?> tags.
4. To use the snippets with our custom delimeter, you need to edit extension snippets (or add your own): install Snippets Ranger plugin, then find needed extension and edit its file. The Snippets Ranger is very handy tool.

I hope I helped somebody to setup VSCode for .ejs files