You have 2 options:

1. Without Using suspense, you can configure that i18n.js like this:

   i18n
     .use(XHR)
     .use(LanguageDetector)
     .init({
       react: { 
         useSuspense: false //   <---- this will do the magic
       }
   });
   

2. Using Suspense, for example:

   <Suspense fallback={<div>Loading... </div>}>
         <App />
   </Suspense>

In order to fix this without putting Suspense back in, you would need to get rid of usages of React.lazy.

I know it's not exactly @IshanPatel's problem but what can cause this error message is if you use a hook like useTranslation() directly inside of the function holding <Suspense />. The solution is to move that code simply into a separate function and have the hook there (see screenshot).

This came up first on Google and I guess someone could waste a long time on finding a fix so I wanted to share it as comment.