next-i18next에서 i18next-http-backend
라이브러리를 이용해
번역 데이터를 backend 와의 API 통신을 통해 가져오는 코드를 작성하려고 하였다.
i18next-http-backend 이란?
i18next-http-backend는 i18next 라이브러리와 함께 사용되는 backend module,
이 module을 사용함으로 써 서버에서 번역 데이터를 동적으로 로드하여 웹에서 사용할 수 있다.장점
웹에서는 HTTP 요청을 통해 서버에서 번역 데이터를 가져오고, 서버는 요청에 따라 해당 언어의 번역 데이터를 응답으로 전송하는 방식인데,
이 방식을 통해 웹에서는 서버의 번역 데이터를 실시간으로 업데이트할 수 있으므로, 다국어 지원을 효율적으로 할 수 있다.
You are passing a wrong module! Please check the object you are passing to i18next.use()
정확한 이유는 알 수 없지만, Next.js에서 특정 esm 모듈을 이상한 방식으로 가져오는 부분이 문제가 되었던 것 같다.
그래서 /cjs
를 통해 commonjs로 강제로 로드하게 만들어 해결하였다.
const I18NextHttpBackend = require('i18next-http-backend');
const I18NextHttpBackend = require('i18next-http-backend/cjs');
레퍼런스