title: React native project with expo-localization and i18n-js
body: <p>i am currently trying to implement localization depending on the system language of the device but something is not working as required.</p>
  <p>I followed the exact same code on expo documentation, for eg. for the button i have i keep getting <code>[MISSING &quot;EN-GB.LOGIN&quot; TRANSLATION]</code> instead of <code>LOGIN</code>.</p>
  <p>Here is my code:</p>
  <p>welcomeScreen.js</p>
  <pre><code>import * as Localization from 'expo-localization';
  import i18n from 'i18n-js';
  
  i18n.translations = {
  en: { login: 'LOGIN'},
  ar: { login: 'تسجيل الدخول'},
  };
  
  i18n.locale = Localization.locale;
  i18n.fallbacks = true;
  
  function WelcomeScreen() {
  return (
  
  &lt;Button
        title={i18n.t('login')}
      /&gt;
  )}
  </code></pre>
  <p>So instead of the code above i decided to go with this:</p>
  <p>i18n.js</p>
  <pre><code>import i18n from 'i18n-js';
  import * as Localization from 'expo-localization';
  import ar from './locales/ar';  
  import en from './locales/en';
  
  i18n.translations = {  
  'en': en,
  'ar': ar,
  };
  
  i18n.locale = Localization.locale.search(/-|_/) !== -1? 
  Localization.locale.slice(0, 2): Localization.locale;
  
  i18n.fallbacks = true;
  
  export default i18n; 
  </code></pre>
  <p>en.js</p>
  <pre><code>const en = { 
  'SignUp':{
  SignUp:&quot;Sign Up&quot;
  }}
  </code></pre>
  <p>ar.js</p>
  <pre><code>const ar = {
  'SignUp':{
  SignUp:&quot;الاشتراك&quot;
  }}
  </code></pre>
  <p>SignUpScreen.js</p>
  <pre><code>import I18n from '../config/i18n';
  
  function RegisterScreen(props) {
  return(
  &lt;Button title={I18n.t('SignUp.SignUp')}
  )}
  </code></pre>