Format html code in Visual Studio Code such that attributes are on separate lines?
VSCode added a way to do this now.
You can edit your settings.json (ctrl+shift+p) and then add the following for the desired effect:
"html.format.wrapAttributes": "force-aligned"
--or--
"html.format.wrapAttributes": "force"
force-aligned will also add indents to align it with the attribute on the line where tag was opened.
Visit this link for more details or updates.
My extended html was being limited by the "Prettier: Print width" setting, I thought I'd put a random value as 0, but then all the tags start breaking the attributes. So he put 10,000. This solved my problem.
There are differnt "formatter" extensions, but one I found does a decent job of this exact formatting that you are looking for. It's called "vscode-tidyhtml".
https://marketplace.visualstudio.com/items?itemName=anweber.vscode-tidyhtml
- Click on the Extensions icon on the left hand side
- Search for and install "vscode-tidyhtml", reload Visual Studio Code
- Hit the "F1" key, and then type "TidyHtml", hit enter
It should format HTML so that attributes are on different lines. I am not sure if it works well for other file types.