Reputation: 130
I used the next-i18next
module for a multi-language application. I don’t understand why I am getting the following error, as I have declared the namespaces the same way it is shown in the documentation.
The error message:
You have not declared a namespacesRequired array on your page-level component: Home.
This will cause all namespaces to be sent down to the client, possibly negatively impacting the performance of your app.
For more info, see: https://github.com/isaachinman/next-i18next#4-declaring-namespace-dependencies
index.ts
import Head from 'next/head'
import styles from '../styles/Home.module.css'
import { withTranslation } from '../i18n'
import { useTranslation } from 'react-i18next';
// import NextI18NextInstance from '../i18n';
function Home({ coursesData }) {
const { t, i18n } = useTranslation(['common', 'cars']);
return (
<>
<h1>{t('common:indexHeader')}</h1>
<h2>{t('cars:title')}</h2>
</>
)
}
// All works with this code, but I plan to use getServerSideProps()
// Home.getInitialProps = async () => {
// return {
// namespacesRequired: ['common', 'courses']
// }
// }
export default Home
How can I solve the problem?
Upvotes: 3
Views: 2901
Reputation: 35573
next-i18next
doesn't supports getServerProps
yet, therefore you need continue using getInitialProps
.
For more info: https://github.com/isaachinman/next-i18next/issues/652
Update: next-i18next
now supports getStaticProps
and getServerProps
: documentation
Upvotes: 4