title: i18n.language undefined in react.js
body: <p>I am trying to use a custom i18n setup but it's says undefined, but when I print the object has the values, how can this be solved.</p>
  <pre><code>import i18n from 'i18next';
  import { initReactI18next } from 'react-i18next';
  import backend from 'i18next-http-backend';
  
  i18n
    .use(backend)
    .use(initReactI18next)
    .init({
      lng: window.location.pathname.split('/')[1] !== 'en' ? 'de' : 'en',
      fallbackLng: 'de',
      whitelist: ['en', 'de'],
      debug: process.env.NODE_ENV === 'development',
      backend: {
        loadPath:
          process.env.NODE_ENV === 'development'
            ? '/locales/{{lng}}/{{ns}}.json'
            : '/static/locales/{{lng}}/{{ns}}.json',
        addPath:
          process.env.NODE_ENV === 'development'
            ? '/locales/add/{{lng}}/{{ns}}.json'
            : '/static/locales/add/{{lng}}/{{ns}}.json',
        crossDomain: true,
      },
  
      ns: 'translations',
      defaultNS: 'translations',
  
      interpolation: {
        escapeValue: false,
        formatSeparator: undefined,
        unescapePrefix: undefined,
        nestingOptionsSeparator: undefined,
      },
      keySeparator: false,
      nsSeparator: false,
      pluralSeparator: undefined,
      contextSeparator: undefined,
    });
  
  export default i18n;
  </code></pre>
  <p>This is how I use it :</p>
  <p>import i18n from 'i18n';</p>
  <pre><code>export const defaultCountryByLanguage = () =&gt;
    i18n.language === 'en'
      ? { country: 'Germany', code: 'DE', prefix: '49', nationality: 'German' }
      : { country: 'Deutschland', code: 'DE', prefix: '49', nationality: 'Deutsch' };
  </code></pre>
  <p>The ternary operator doesn't work because <code>i18n.language</code> says it's null, yet when I print it shows the values.</p>