I have gotten to the point where there are post requests happening to the backend, but there is nothing listening because vite doesn't have a backend that listens. I am at an loss.
Stuff that I need to get translated is coming from an API, on component load in the app, so I can't just parse files that I've written.
// i18n.ts
import i18n from 'i18next';
import HttpBackend from 'i18next-http-backend'
import { initReactI18next } from 'react-i18next';
import LanguageDetector from 'i18next-browser-languagedetector';
import enTranslations from './locales/en/translation.json';
import etTranslations from './locales/et/translation.json';
import ruTranslations from './locales/ru/translation.json';
i18n
.use(LanguageDetector)
.use(initReactI18next)
.use(HttpBackend)
.init({
fallbackLng: 'en',
debug: true,
keySeparator: false,
nsSeparator: false,
saveMissing: true, // this is important
saveMissingTo: 'all',
interpolation: {
escapeValue: false,
},
resources: {
en: {
translation: enTranslations,
},
et: {
translation: etTranslations,
},
ru: {
translation: ruTranslations,
},
},
});
export default i18n;
// App.tsx
import React from 'react'
import ReactDOM from 'react-dom/client'
import "./i18n.ts"
import './index.scss'
import App from './App.tsx'
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<App />
</React.StrictMode>,
)
result:
Request URL:
http://localhost:5173/locales/add/en/translation
Request Method:
POST
Status Code:
404 Not Found
Remote Address:
127.0.0.1:5173
Referrer Policy:
strict-origin-when-cross-origin
I have no idea where to move on, I do not want to use anything I can't run locally, just wish to add missing keys to translations.