i need help i got this error
./src/components/Header/Header.js
Attempted import error: 'UseTranslation' is not exported from 'react-i18next'.
its a new projects where i have install the https://react.i18next.com step by step but i got problem with the import UseTranslation
in header.js i got just this
import { useTranslation } from 'react-i18next';
//style
import "./Header.scss";
class Header extends Component {
render() {
const { t, i18n } = useTranslation();
return (
<div className="container-header">
<div className="container-header__main">
<div className="container-header__main-overlay">
<div className="container-header__main-overlay__text">
<div className="container-header__main-overlay__text__title">
{t('hello')}
</div>
<div className="container-header__main-overlay__text__subtitle">
{t('hello2')}
</div>
</div>
</div>
</div>
</div>
);
}
}
export default Header;
this is my i18n.js this is ok i think
import i18n from "i18next";
import { reactI18nextModule } from "react-i18next";
import EN from './assets/translation/en.json';
import CZ from './assets/translation/cz.json';
const resources = {
en: {
translation: EN
},
cz:{
translation: CZ
}
};
i18n
.use(reactI18nextModule)
.init({
resources,
lng: "en",
fallbackLng: "en",
useSuspense: false,
});
export default i18n;
the
useTranslation
it use forhook
but you use classComponent you shold useHoc
and in your index.js add Suspense