Formatage des messages

18ways utilise waysParser par défaut. Ce parseur est ce qui vous permet de garder la copie source lisible tout en gérant les variables et le formatage sensible à la locale.

Variables

Utilisez des accolades pour les variables et passez les valeurs via vars.

const label = await engine.t(
  'Welcome back, {name}',
  {
    vars: { name: 'Ada' },
  }
);

Pluralisation

Utilisez des blocs de pluriel au style ICU lorsque la phrase change réellement de forme.

const summary = await engine.t(
  '{count, plural, =0{No messages} =1{One message} other{{count} messages}}',
  {
    vars: { count: 3 },
  }
);

Dates et argent

Si vous passez un véritable Date ou un objet semblable à de l'argent avec amount et currency, 18ways le formattera automatiquement même avec un simple espace réservé comme {publishedAt} ou {renewalTotal}.

Utilisez le formatteur explicite uniquement lorsque vous souhaitez contrôler la sortie, comme dateStyle:long ou un diviseur monétaire personnalisé.

const publishedAt = new Date(
  '2026-03-14T09:00:00Z'
);
const renewalTotal = {
  amount: 1900,
  currency: 'USD',
};
 
const updatedLabel = await engine.t(
  'Last updated {publishedAt}',
  {
    vars: { publishedAt },
  }
);
 
const totalLabel = await engine.t(
  'Renewal total {renewalTotal}',
  {
    vars: { renewalTotal },
  }
);
 
const detailedDate = await engine.t(
  'Detailed date: {publishedAt, date, dateStyle:long}',
  {
    vars: { publishedAt },
  }
);

Par défaut, les montants d'argent sont traités comme des unités mineures. Si vous avez déjà des unités majeures, utilisez le formateur d'argent explicite avec divisor: 1.

Blocs de sélection

Utilisez select lorsque la copie dépend d'un petit ensemble de valeurs discrètes.

const banner = await engine.t(
  '{isSignedIn, select, true{Welcome back, {name}} false{Sign in to continue} other{Sign in to continue}}',
  {
    vars: {
      isSignedIn: true,
      name: 'Ada',
    },
  }
);

Composition des composants

@18ways/core renvoie des chaînes de caractères. Si vous avez besoin de texte enrichi, gardez la phrase entière et gérez le balisage dans votre propre moteur de rendu.

const cta = await engine.t(
  'Click here to see more'
);

Si votre application a besoin d'une composition JSX automatique, passez à @18ways/react ou @18ways/next.

Règle pratique

Si la phrase peut être écrite comme une phrase complète avec quelques variables, gardez-la dans un seul message. Cela améliore considérablement la qualité de la traduction par rapport à l'assemblage de fragments dans le code.