Перевод i18next - 404 Not Found in Storybook with i18next-http-backend
Я пробовал интегрировать
i18next
в мой сборник рассказов с
i18next-http-backend
и он пытается загрузить файл переводов из
http://localhost:6006/public/locales/en/translation.json
но получает 404. У меня есть языковые файлы внутри
app/public
каталог (
app
является родным братом
stories
и
.storybook
каталоги)
Мой сборник рассказов
i18next.js
выглядит как показано ниже,
import HttpApi from 'i18next-http-backend';
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
const ns = ['translation'];
const supportedLangs = ['en', 'es'];
i18n.use(initReactI18next)
.use(HttpApi)
.init({
//debug: true,
lng: 'en',
fallbackLng: 'en',
interpolation: {
escapeValue: false,
},
defaultNS: 'translation',
ns,
supportedLangs,
});
supportedLangs.forEach((lang) => {
ns.forEach((n) => {
i18n.addResources(
lang,
n,
require(`../app/public/locales/${lang}/${n}.json`)
);
});
});
export {i18n};
Я пробовал добавить
loadPath
тоже конфиги (после [this][2]), но проблема все еще возникает.
.init({
//debug: true,
lng: 'en',
fallbackLng: 'en',
...
backend: {
loadPath: `/public/locales/{{lng}}/{{ns}}.json?lng={{lng}}&{{ns}}`,
// loadPath: `/locales/{{lng}}/{{ns}}.json?lng={{lng}}&{{ns}}`, tried this too
},
Вот как мои
.storybook/preview.js
похоже
import { muiTheme } from 'storybook-addon-material-ui';
import { theme } from '@internal/component-library';
import {i18n} from './i18next.js';
export const decorators = [
muiTheme([theme])
];
export const parameters = {
actions: { argTypesRegex: "^on[A-Z].*" },
controls: {
matchers: {
color: /(background|color)$/i,
date: /Date$/,
},
},
i18n,
locale: 'en',
locales: {
en: 'English',
es: 'Spanish',
},
}
Мой
package.js
имеет следующие
scripts
для сборника рассказов
"scripts": {
...
"storybook": "start-storybook -p 6006",
"build-storybook": "build-storybook"
}