Skip to main content

Command Palette

Search for a command to run...

Prettier for ERB

Updated
1 min read
A

I'm an engineer, educator, and entrepreneur that has been building digital products for over 20 years with experience in startups, education, technical training, and developer ecosystems.

I founded Flatiron School in NYC where I taught thousands of people how to code. Previously, I was the founder of Designer Pages. Currently I'm the Chief Product Officer at Revature.

I love using Prettier as a formatter for my code. However, I write a lot of ERB to do Ruby on Rails and out of the box, prettier doesn't play nice with ERB. There is a prettier-erb package but it is old and does not seem to work with new versions of prettier. However, I found an easy workaround.

In my .prettierrc.json, I add the following configuration:

{
  "overrides": [
    {
      "files": "*.erb",
      "options": {
        "parser": "html"
      }
    },
    {
      "files": "erb",
      "options": {
        "parser": "html"
      }
    },
    {
      "files": "*.html.erb",
      "options": {
        "parser": "html"
      }
    },
  ]
}

Prettier works really well with HTML and just telling it to treat ERB as HTML by overriding the formatter works super well. This combined with the prettier-vscode extension and you can now format ERB with prettier pretty effectively.

If anyone knows a better way, I'd love to hear it!

More from this blog

code.avi.nyc

23 posts

I'm an engineer, educator, and entrepreneur that has been building digital products for over 20 years with experience in startups, education, technical training, and developer ecosystems.