Awesome Open Source
Awesome Open Source


NPM Version

Sizes (svelte-intl and format-message):

Package Size Package Size

Internationalize your Svelte 3 apps using format-message.

Svelte 2

For Svelte 2 version see this branch.


npm i svelte-intl format-message # format message is a peer dependency


<script context="module">
  import { locale, translations, getBrowserLocale } from 'svelte-intl';

  // If you want to split your bundle, you can call this multiple times,
  // the dictionaries will be merged.
    en: {
      hello: 'Hello, {name}',
    pt: {
      hello: 'Olá, {name}',

  locale.set(getBrowserLocale('en')) // try to use window.navigator.language

  // use _ or translate
  import { _ } from 'svelte-intl'

  export let name = 'John'

<h1> {$_('hello', { name })} </h1>


translate (or "_")

Translation store

  • Type: svelte.Readable<typeof formatMessage>


  import { get } from 'svelte/store'
  import { translate } from 'svelte-intl'

  const title = get(translate)('title')

<h1> Title: {title} </h1>
<h1> Reactive Title: {$translate('title')} </h1>


Available translations

  • Type: Object
    • set(translations) => void : Replace translations (avoid this)
    • update(translations) => void : Add more translations
    • subscribe : Store subscription, avoid using this directly


Current locale

  • Type: like svelte.Readable<string>, but with safe update and set (logs error if locale is not found)
  • Note: Set and update return a boolean indicating if the locale was found


Available locales, derived from translation

  • Type: svelte.Readable<string[]>


<!-- LanguageSelector.svelte -->
  import { locale, locales } from 'svelte-intl'

  const setLocale = e => locale.set(

<select value={$locale} on:change={setLocale}>
  {#each $locales as l}
    <option value={l}> {l} </option>


See format-message options
Just call options.set({ }) :)

  • Type: svelte.Readable<formatMessage.SetupOptions> (but update merges with current config)


Tries to match the window.navigator.language to the available dictionaries

  • Params:
    • defaultLocale {string}: If no match is found, returns this
Related Awesome Lists
Top Programming Languages
Top Projects

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Typescript (266,129
Types (29,932
Format (16,286
Translation (13,604
Svelte (6,418
I18n (4,859
Intl (3,345
Sveltejs (567