How to configure `I18n Ally` vscode plugin to read my locals?

6.3k Views Asked by At

I am using i18next and react-i18next. i18n Ally v2.8.1.

I have one locale file: /locales/en.json Structure of this file:

{
    "pagetitle.home": "Home",
    "pagetitle.restore": "Restore",
    "pagetitle.register": "Register"
}

When hover on code i18n.t('pagetitle.restore') ru: i18n key "en.pagetitle.restore" does not exist(i18n-ally-key-missing)

Which config of extension should be?

P.S. I cant change locales structure.

1

There are 1 best solutions below

0
On

Try changing the .vscode/settings.json to add your "locals" path:

{
  "i18n-ally.localesPaths": ["src/locales"],
  "i18n-ally.sourceLanguage": "english",
}

If this does not work, try to add a defaultNamespace to your language file:

Example:

en.json

{
  "translation": {
    "login": {
      "title": "Welcome!",
      "user": "User",
      "password": "Password",
    },  
  }
}

Implementation:

const {t} = useTranslation();
const title = title: t('login.title')

.vscode/settings.json

{
  "i18n-ally.localesPaths": ["src/utils/language"],
  "i18n-ally.defaultNamespace": "translation",
  "i18n-ally.sourceLanguage": "english",
  "i18n-ally.keystyle": "nested"
}