Railsのテンプレートエンジンをhamlやslimに変更する

Railsのビューのテンプレートエンジンは、デフォルトでerbが適用されます。
しかし、hamlslimを用いた方が、コードが見やすく、綺麗に書けそうです。
ここでは、Railsアプリで使用するテンプレートエンジンをhamlやslimに変更する方法について纏めます。

環境

検証に使用したのは、

  • Ruby 2.3.3(rbenv)
  • Rails 5.0.1
  • haml-rails 0.9.0
  • slim-rails 3.1.1

です。

hamlを使う

Railsのジェネレータが生成するビューテンプレートをhamlに対応させるために、haml-railsを使用します。

Gemfile

haml-railsをGemfileに追加して、bundle installします。

gem 'haml-rails'

haml:application_layoutジェネレータ

haml-railsを導入すると、haml:application_layoutというジェネレータが使えるようになります。これを使うと、app/views/layouts/application.html.erbに代わるapp/views/layouts/application.html.hamlを生成してくれます。

bundle exec rails g haml:application_layout
Success! app/views/layouts/application.html.haml is created.
Please remove the erb file: app/views/layouts/application.html.erb

生成されたapplication.html.hamlは次のとおりです。

!!!
%html
  %head
    %meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/
    %title RailsHamlExample
    = csrf_meta_tags
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
  %body
    = yield

これで、テンプレートエンジンをhamlとしてアプリケーションが実装できます。

slimを使う

Railsのジェネレータが生成するビューテンプレートをslimに対応させるために、slim-railsを使用します。

Gemfile

slim-railsをGemfileに追加して、bundle installします。

gem 'slim-rails'

html2slim

haml-railsと違い、slim-railsは、application.html.erbを変換するジェネレータを提供していません。代わりに、html2slimを使います。

Gemfileにhtml2slimを追加して、bundle installします。

gem 'html2slim'

そして、erb2slimを実行することで、erbをslimに変換することができます。

bundle exec erb2slim app/views/layouts/application.html.erb

生成されたapplication.html.slimは次のとおりです。

doctype html
html
  head
    title
      | RailsSlimExample
    = csrf_meta_tags
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
  body
    = yield


hamlにしても、slimにしても簡単に適用できますね。
ちなみに、erb、haml、slimそれぞれどのような性能となるのかを検証した結果が、

Rails Template engines performance – Codeando con Ruby – Medium

にまとまっていて、結果、slimが最もよい性能であった旨が記載されています。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*
*
*