How to format/beautify rails erb code

Question

How to format/beautify rails erb code. The view code is a mix of erb and JS.

I tried using the following tool as well, but it didn't help https://github.com/katgironpe/rails-erb-lint

Answer 1

A good IDE to format/beautify rails is RubyMine.

RubyMine is able to reformat many types of files, like Ruby, HTML, JavaScript, CSS, etc.

example for reformat erb file:

Before:

After:

You can set the code style in the Preferences / Editor / Code Style

Answer 2

The tool which you already used, i.e., rails-erb-lint, checks only for the validity of you ERB and doesn't help with beautifying the ERB code. I don't know which editor you are using, but you can try either Sublime Text 3 or Github's Atom. Both of these have 3rd party packages to beautify Ruby and ERB code. Moreover, the indentation and trailing whitespace removing ability of these editors are enough to beautify/format the ERB files, though they have menu items/ shortcuts to do this on-demand/selectively too.

Answer 3

If you are using Sublime Text, check out this "Sublime Text 2 & 3 Plugin to BeautifyRuby":

https://github.com/CraigWilliams/BeautifyRuby

Once installed via Sublime's Package Control System you can use the shortcut ctrl + alt + k (on Windows + Linux) or ctrl + cmd + k (on OS X) to beautify your Ruby and erb-files manually - or configure the plugin to do that automatically before saving any Ruby- and erb-file. Configuration is easy - you find the config-file here (via the Sublime- menu):

Preferences > Package Settings > BeautifyRuby > Settings - Default:

{
    // Specify your ruby interpreter (below). (Note, if you are using a linux distro with Rbenv instead of RVM, then try the following path: "ruby": "~/.rbenv/shims/ruby")  
    "ruby": "~/.rvm/bin/rvm-auto-ruby", 
    // Use 2 Spaces instead of tabs: 
    "translate_tabs_to_spaces": true,
    "tab_size": 2,
    // You can change the file patterns handled by this plugin:
    "file_patterns": ["\\.html\\.erb", "\\.rb", "\\.rake", "Rakefile", "Gemfile", "Vagrantfile"],
    "html_erb_patterns": ["\\.html\\.erb"],
    // This package offers a pre-save hook; when activated, your ruby and erb files will 
    // be reformatted automatically before saving (deactivated by default)
    "run_on_save": false,
    // The sublime command "beautify_ruby" performs a save after formatting. 
    // (activated by default) 
    "save_on_beautify": false    
} 

BeautifyRuby depends on the Ruby gem htmlbeautifier, which needs to be installed on your system first. Otherwise the plugin throws an error each time you try to beautify your code. Make sure, the ruby-interpreter-setting in the config file shown above points to the correct ruby which holds the htmlbeautifier-gem...