ICU format is not recognized
Zofren opened this issue · 2 comments
Zofren commented
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 commented
Hi @Zofren!
You should use @sveltekit-i18n/base
package instead of just sveltekit-i18n
.
You can follow this example
Zofren commented
Yes indeed. And I put parse instead of parse(). It works now. Thank you.