Js I18next Svelte

i18next-svelte

Svelte wrapper for i18next.

Summary

• ES module
• export:

    {
      i18n as default,
      i18n,
      load,
      isLoading,
      isError
    }
  

• where:
  • i18n
    • is a store that holds an initialized instance of i18next
  • isLoading
    • is a store that holds an object:
      {init, changeLanguage, loadLanguages, loadNamespaces, loadResources, reloadResources}
    • each object key stores a boolean
    • each boolean indicates whether or not the corresponding load method is currently running
  • isError
    • is a store that holds an object:
      {init, changeLanguage, loadLanguages, loadNamespaces, loadResources, reloadResources}
    • each object key stores a boolean
    • each boolean indicates whether or not the corresponding load method has completed running with an error
  • load
    • is not a store
    • is an object:
      {init, changeLanguage, loadLanguages, loadNamespaces, loadResources, reloadResources}
    • each object key stores a function
    • each function is a wrapper around a method that would normally be called on an initialized instance of i18next
      • the return value is unchanged
    • each wrapper should be used instead
      • it delegates the call to the initialized instance of i18next held by the store: i18n
      • it manages the state of stores: isLoading and isError
      • completion of the operation updates the store: i18n

Install

  npm install --save "@warren-bank/i18next-svelte"

Usage

initialization:

• performed once

  • for example: in the root layout of a SvelteKit project

• short demo

    import i18next from 'i18next'
    import {load} from '@warren-bank/i18next-svelte'
  
    const options = {}
  
    i18next
      .use(...)
      .use(...)
  
    load.init(i18next, options)
  

• full demo

translation:

• performed many

  • for example: on every page

• short demo

    <script>
      import i18n from '@warren-bank/i18next-svelte'
    </script>
  
    <h1>{$i18n.t('my.key')}</h1>
  

• full demo

Full Demo

  cd demo
  npm install
  npm run dev

  # open URL: http://localhost:5173/

Legal

• copyright: Warren Bank
• license: GPL-2.0