Docs / Ember
Ember i18n avec ember-intl, automatisé
Localisez une application Ember : les templates Glimmer (.hbs, .gjs, .gts) deviennent des appels {{t}} ember-intl, avec pluriels, et une route d'application qui choisit la langue.
Comment ça marche
Le texte du modèle devient {{t "key" name=this.user.name}}, les attributs placeholder={{t "key"}}, et {{if (eq n 1) "item" "items"}} dans une phrase un message pluriel.
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.
<h1>Your basket</h1>
<p>Hi {{this.user.name}}, you have {{@count}} new messages.</p>
<p>See the <a href="/faq">FAQ</a> before you order.</p>
<input placeholder="Search products" /><h1>{{t "cart.your_basket"}}</h1>
<p>{{t "cart.hi_you_have_new_messages" name=this.user.name count=@count}}</p>
<p><I18nT @key="cart.see_the_before_you_order" @slots="a" as |is|>{{#if is.a}}<a href="/faq">{{t "cart.faq"}}</a>{{/if}}</I18nT></p>
<input placeholder={{t "cart.search_products"}} />{
"cart": {
"your_basket": "Your basket",
"hi_you_have_new_messages": "Hi {name}, you have {count} new messages.",
"faq": "FAQ",
"see_the_before_you_order": "See the {a} before you order.",
"search_products": "Search products"
}
}Ce que l'installation ajoute
La première exécution configure ember-intl si le projet ne l'a pas encore :
ember-intl, avec des messages danstranslations/<locale>.json- Une route d'application qui choisit la langue et définit
<html lang dir>
Exécutez-le
L'interface CLI nécessite Node.js 22 ou une version ultérieure.
npm install --save-dev localize-dev
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,deOu ajoutez le Action GitHub et recevez une pull request à chaque push. Essayez-le d'abord sur votre propre code dans le playground.