How do I auto format Ruby or .erb files in VS Code?

You can set format associations in VSCode, so .erb files would be treated like .html.

Go to File->Preferences->Settings->Click ... in top right corner->Open settings.json

Then add this piece of code to your settings.json

"files.associations": {   "*.html.erb": "html"}

This is how I solved this problem. It will remove some of the code highlights but will autoformat HTML templates like an HTML document.

You're going to need all of these settings in VS Code's settings.json file:

"ruby.rubocop.onSave": true,"editor.formatOnSaveTimeout": 5000,"editor.formatOnSave": true,"files.associations": {    "*.erb": "erb"},

Save the settings file. Install the "ruby-rubocop" and "ERB Formatter/Beautify" extensions on VS Code. Follow the documentation on both of those extensions to install their gem dependencies. Restart VS Code.

Format-on-save functionality will only trigger if the file is actually saved (which only happens if you change the file). Saving a file that has no changes will not trigger format-on-save.

You can use Rufo to format your Ruby code. It is an opinionated formatter (like Prettier is for JS, if you are familiar with it).

You can use the vscode-rufo extension to integrate it with VSCode.