localize.dev

Dokumentation / Ruby on Rails

Rails i18n für ERB-Ansichten, automatisiert

Führe den statischen Text in Rails-ERB-Ansichten in t()-Aufrufe mit config/locales YAML um, mit Pluralformen durch count:, verfügbaren Sprachen und Sprachumschaltung – alles in einem Befehl oder Pull Request.

Funktionsweise

Text in ERB-Ansichten wird zu <%= t('key', name: @user.name) %>, mit %{name}-Platzhaltern in config/locales/<locale>.yml unter dem Sprachschlüssel. Logik-Tags trennen Sätze; <script> und <code> bleiben unverändert.

Ein ternärer Ausdruck mit einer Zählung wird zu einer Pluralform mit one: und other: (und allem, was jede Sprache benötigt), aufgerufen mit count:.

Vorher und nachher

Die tatsächliche Ausgabe der Engine für diese Datei. Bei einer echten Ausführung benennt das gehostete Modell die Schlüssel anhand des Kontexts.

app/views/carts/show.html.erb · vorher
<h1>Welcome back, <%= @user.name %>!</h1>
<% if @items.any? %>
  <p><%= @items.count %> <%= @items.count == 1 ? 'item' : 'items' %> in your cart</p>
<% end %>
<input placeholder="Search products" type="text">
app/views/carts/show.html.erb · nachher
<h1><%= t('show.welcome_back', name: @user.name) %></h1>
<% if @items.any? %>
  <p><%= t('show.items_in_your_cart', count: @items.count) %></p>
<% end %>
<input placeholder="<%= t('show.search_products') %>" type="text">
config/locales/en.yml
en:
  show:
    welcome_back: Welcome back, %{name}!
    items_in_your_cart:
      one: "%{count} item in your cart"
      other: "%{count} items in your cart"
    search_products: Search products

Was das Setup hinzufügt

Der erste Durchlauf richtet Rails I18n ein, falls das Projekt es noch nicht hat:

  • config.i18n.available_locales in config/application.rb
  • Ein switch_locale-Umgebungs-Aktion in ApplicationController: ?locale=, dann ein lang-Cookie, dann Accept-Language

Ausführen

Die CLI benötigt Node.js 22 oder neuer, sonst nichts: npx führt es aus, ohne ein package.json zum Projekt. Kein Node auf Ihrem Rechner? Die GitHub Action unten führt es für Sie aus.

npx localize-dev login

# Preview, then write the changes
npx localize-dev run --dry-run -l es,fr,de
npx localize-dev run -l es,fr,de

# Or open a pull request instead
npx localize-dev pr -l es,fr,de

Oder fügen Sie die GitHub Action und erhalten Sie bei jedem Push einen Pull Request. Probieren Sie es zuerst mit Ihrem eigenen Code im Spielbereich.