Save missing

키를 찾을 수 없는 경우에 대한 설정
App.js

function App() {
  const { t, i18n } = useTranslation();

  return (
    <div className="App">
      <div>
    	...
      <p>{t('new.key', '추가될 내용')}</p>
    </div>
  );
}

Backend(i18next-http-backend)가 로컬에 설정된 파일에 Post 요청을 보내서 확인하여 없어 missinKey 메시지 보임

이렇게 Post 요청을 대신하여 사용할 수 있는 다른 방법

i18next-locize-backend

locize란?

i18next 제작자들이 설립한 스마트 번역 관리 시스템이다.
번역에 관련된 내용을 쉽게 보고 수정할 수 있는 시스템을 제공한다.

관리 시스템에 관리하기 때문에 로컬에 파일이 없음

의존성 추가

//npm 
npm install i18next-locize-backend

//yarn
yarn add i18next-locize-backend

i18n 설정 수정

i18n.js

import Locize from 'i18next-locize-backend';

i18next
    .use(initReactI18next)
    .use(LanguageDetector)
    .use(Locize)
    .init({
    debug: true,
    fallbackLng : 'en',
    saveMissing : true,
    backend : {
        projectId : '',
        apiKey : ''
    }
})

나는 i18next-locize-backend 를 사용하지 않았다..