i18n

public/locales/en/general.json

@@ -0,0 +1,3 @@
+{
+  "home": "Home"
+}

public/locales/pt/general.json

@@ -0,0 +1,3 @@
+{
+  "home": "Página inicial"
+}

src/index.tsx

@@ -1,11 +1,15 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+
+import 'services/i18n';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
 
 ReactDOM.render(
   <React.StrictMode>
-    <App />
+    <React.Suspense fallback={<div />}>
+      <App />
+    </React.Suspense>
   </React.StrictMode>,
   document.getElementById('root'),
 );

src/services/i18n.ts

@@ -0,0 +1,24 @@
+import i18next from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import HttpApi from 'i18next-http-backend';
+import LanguageDetector from 'i18next-browser-languagedetector';
+
+i18next
+  .use(initReactI18next)
+  .use(HttpApi)
+  .use(LanguageDetector)
+  .init({
+    supportedLngs: ['en', 'pt', 'es'],
+    fallbackLng: 'pt',
+    nonExplicitSupportedLngs: true,
+    ns: ['general'],
+    defaultNS: 'general',
+    interpolation: {
+      escapeValue: false,
+    },
+    backend: {
+      loadPath: `${process.env.PUBLIC_URL}/locales/{{lng}}/{{ns}}.json`,
+    },
+  });
+
+export default i18next;

src/services/index.ts

@@ -1 +1,4 @@
-export { };
+import i18next from './i18n';
+
+// eslint-disable-next-line import/prefer-default-export
+export { i18next };