Myujth

I use i18next and my application is not translated. No message displays and I have none error in the console.

Index.js

import React from 'react';
import ReactDOM from 'react-dom';

import I18nextProvider from 'react-i18next';
import i18next from 'i18next';

import "assets/scss/material-kit-react.css?v=1.3.0";
import "assets/scss/material-kit-react.css?v=1.3.0";
import * as serviceWorker from './serviceWorker';

import createBrowserHistory from "history";

import messages_fr from "locales/fr.json";

const hist = createBrowserHistory();

i18next.init(
 interpolation: escapeValue: false , // React already does escaping
 lng: 'fr', // language to use
 resources: 
 fr: 
 langue: messages_fr
 ,
 ,
);

ReactDOM.render((
<I18nextProvider i18n=i18next>
 </Login>
</I18nextProvider>
), document.getElementById('root')
);
serviceWorker.unregister();

And in my page :

import translate, Trans from 'react-i18next';

<Trans i18nKey='myKey.mySubKey'></Trans>

export default translate('langue')(withStyles(loginPageStyle)(LoginPage));

I don't understant why my text is not.

I made as this but my application always stays in English while the language of my browser is French.

i18next
.use(LanguageDetector)
.init(
 interpolation: escapeValue: false ,
 lng: 'en',
 resources: 
 en: 
 langue: messages_en
 ,
 fr: 
 langue: messages_fr
 ,
 ,
);

My index.js :

import React from 'react';
import ReactDOM from 'react-dom';

import Router, Route, Switch, Redirect from "react-router-dom";

import I18nextProvider from 'react-i18next';
import i18next from 'i18next';

import * as serviceWorker from './serviceWorker';

import createBrowserHistory from "history";

import indexRoutes from "routes/index.jsx";

import messages_en from "locales/en.json";
import messages_fr from "locales/fr.json";

import LanguageDetector from 'i18next-browser-languagedetector';

const hist = createBrowserHistory();

i18next
 .use(LanguageDetector)
 .init(
 interpolation: escapeValue: false ,
 fallbackLng: 'en',
 resources: 
 en: 
 langue: messages_en
 ,
 fr: 
 langue: messages_fr
 ,
 ,
 );

 ReactDOM.render((
 <I18nextProvider i18n=i18next>
 <Router history=hist>
 <Switch>
 indexRoutes.map((prop, key) => 
 if (prop.redirect)
 return <Redirect from=prop.path to=prop.to key=key />;
 return <Route path=prop.path component=prop.component key=key />;
 )
 </Switch>
 </Router>
 </I18nextProvider>
 ), document.getElementById('root'));

serviceWorker.unregister();