localize.dev

Docs / Ruby on Rails

Rails i18n pour les vues ERB, automatisé

Déplacez le texte durcissant dans les vues ERB de Rails vers des appels t() avec YAML de config/locales, les pluriels avec count:, les langues disponibles et un commutateur de langue, tout en un seul commande ou pull request.

Comment ça marche

Le texte dans les vues ERB devient <%= t('key', name: @user.name) %>, avec des placeholders %{name} dans config/locales/<locale>.yml, sous la clé de langue. Les balises logiques divisent les phrases; <script> et <code> restent inchangés.

Un opérateur ternaire sur un compte devient un pluriel avec les formes one: et other: (et tout ce que chaque langue nécessite), appelé avec count:.

Avant et après

La sortie réelle du moteur pour ce fichier. Lors d'une exécution réelle, le modèle hébergé nomme les clés à partir du contexte.

app/views/carts/show.html.erb · avant
<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 · après
<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

Ce que l'installation ajoute

La première exécution configure Rails I18n si le projet ne l'a pas encore :

  • config.i18n.available_locales dans config/application.rb
  • Une action switch_locale dans ApplicationController : ?locale=, puis un cookie lang, puis Accept-Language

Exécutez-le

La CLI nécessite Node.js 22 ou une version ultérieure, rien d'autre : npx l'exécute sans ajouter de package.json au projet. Pas de Node sur votre machine ? L'action GitHub ci-dessous l'exécute pour vous.

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

Ou ajoutez le Action GitHub et recevez une pull request à chaque push. Essayez-le d'abord sur votre propre code dans le playground.