ICU format is not recognized

[Zofren]

Hi, I have hard times implementing the plural with the ICU parser.

In the svelte file

<script>
    import { t } from '$lib/i18n/translations';

</script>

<div class="item-stats">
  <i class="fas fa-plane-departure" />
  <span class="stat-number">{stats.flights}</span>
  <span class="stat-label">{$t('home.stats.flight', { n: stats.flights })}</span>
</div>

The translations.js file

import i18n from 'sveltekit-i18n';
import parser from '@sveltekit-i18n/parser-icu';

const keys = ['common', 'home'];
const langs = ['fr', 'en']; //

const languages = [];

keys.forEach(key => {
    langs.forEach(lang => {
        languages.push({
            key: key,
            locale: lang,
            path: `./${lang}/${key}.json`
        });
    });
});

const config = {
    initLocale: 'fr',
    parser: parser,
    loaders: languages.map(lang => ({
        key: lang.key,
        locale: lang.locale,
        loader: async () => (await import(/* @vite-ignore */lang.path)).default
    }))
};

export const { t, loading, locales, locale, initialized, translations, loadTranslations } =
    new i18n(config);

loading.subscribe(async ($loading) => {
    if ($loading) {
        console.log('Loading translations...');
        await loading.toPromise();
        console.log('Updated translations', translations.get());
    }
});

The lang json file :

{
    "stats": {
        "flight": "{n, plural, one {vol} other {vols}}",
    }
}

Standard i18n is working fine so config is ok. But it displays the ICU formatted string on the page instead of interprering it.

[jarda-svoboda]

Hi @Zofren! You should use @sveltekit-i18n/base package instead of just sveltekit-i18n. You can follow this example

[Zofren]

Yes indeed. And I put parse instead of parse(). It works now. Thank you.