Text is undefined and 'Missing helper: "__" '

[swap1789]

I am getting 'undefined' for the text when checked inside storybook. And it throws 'Missing helper: "__" ' error when I try to run the local dev server ? I used npm i handlebars-i18n to install the required dependencies and in my js file I have imported them as follows. Please let me know if I am missing something

import 'handlebars'; import i18next from 'i18next'; import HandlebarsI18n from 'handlebars-i18n';

HandlebarsI18n.init(); const initialize = () => { i18next.init({ resources: { en: { translation: { phrase1: 'What is good?', phrase2: '{{thing}} is good.', }, }, de: { translation: { phrase1: 'Was ist gut?', phrase2: '{{thing}} ist gut.', }, }, }, lng: 'en', }); };

document.addEventListener('DOMContentLoaded', initialize);

[chrwlk]

I also had the problem of getting undefined for all translations within tests with Vitest. I was able to solve it by passing i18next.

  i18next.init({
    resources: {
      en: {
        translation: {
          phrase1: 'What is good?',
          phrase2: '{{thing}} is good.',
        },
      },
    },
    lng: "en",
  });

  handlebarsI18n.init(undefined, i18next);