svelte-i18next

Presentando l'involucro snello per i18next.

Questa libreria, basata su i18next, avvolge un'istanza i18next all'interno di un negozio snello e osserva gli eventi i18next come languageChanged, resource added, ecc. per essere in grado di rendere i nostri componenti svelte.

Pacchetto:-

GitHub:-

L'implementazione è simile a questa:

Il pacchetto crea uno Svelte scrivibile di i18next e ascolta gli eventi attivati ​​da eventuali aggiornamenti sull'istanza di i18next.
Ad esempio, se un'applicazione carica un nuovo spazio dei nomi per le sue traduzioni, il pacchetto svelte_i18next attiverà l'
i18next.on(‘loaded’, function(loaded) {})evento.

Controlla gli eventi i18next qui.

Utilizzo:

i18n.js

import i18next from "i18next";
import { createI18nStore } from "svelte-i18next";

i18next.init({
   lng: 'en',
   resources: {
     en: {
       translation: {
         "key": "hello world"
       }
     }
   }
});

export const i18n = createI18nStore(i18next);

<script>
  import i18n from './i18n.js';
</script>

<div>
    {$i18n.t('key')}}
</div>

Puoi anche utilizzare gli spazi dei nomi come faresti con i18next e lo svelte wrapper eseguirà nuovamente il rendering delle traduzioni in base allo spazio dei nomi fornito.

import { createI18nStore } from 'svelte-i18next'
const i18n = createI18nStore(i18n_instance) 
i18n.loadNamespaces(['example']) // this triggers the re-render and loads translations from the provided namespace.
<div>
    {$i18n.t(key)}
</div>

Mostra un po' d'amore @svelte-i18next ❤