James Brett
James Brett

Reputation: 362

i18n React-Native unexpected token ';'

I have I18n set up in an IOS project and am working in an Android project now.

I keep getting an unexpected token ';' error.

When I comment out the import statement for strings and the static navigationOptions the error goes away and the build succeeds:

import React, { Component } from 'react';
import {
  View,
  Text,
  StyleSheet,
  ImageBackgroud,
  // TextInput
} from 'react-native';
// import {
//   Button
// } from 'react-native-elements';
// import {
//   Spinner
// } from '../components/common';

here --> //import { strings } from '../locales/i18n';

class SignUp extends Component {

  //static navigationOptions = {
 here -->// title: strings('SignUp.title')
  //}

  constructor(props) {
    super(props);
    this.state = {
      email: '',
      password: '',
      loading: false
    };
  }

  render() {
   return (
      <ImageBackgroud
        source={require('.././assets/swooshResize.jpg')}
        style={styles.backG}
      >
        <View>
          <Text>
           HELLO!
          </Text>
        </View>
      </ImageBackgroud>
    );
  }

}

const styles = StyleSheet.create({
  backG: {
     width: '100%',
     height: '100%'
  },
});

export default SignUp;

This is the locales file i18n.js:

import I18n from 'react-native-i18n';
import en from './en.json';
import fr from './fr.json';
import es from './es.json';

I18n.fallbacks = true;

I18n.translations = {
  en, 
  fr,
  es
};

// RTL language support
// export const isRTL = currentLocale.indexOf('he') === 0 || 
currentLocale.indexOf('ar') === 0;

// Allow RTL alignment in RTL languages
// ReactNative.I18nManager.allowRTL(isRTL);

export function strings(name, params = {}) {
  return I18n.t(name, params);
}

export default I18n;

And this is the JSON for english:

{
  "SignUp": {
    "title": "Sign Up"
  }
}

Entire Error Message:

Unexpected token ';' (http://10.0.2.2:8081/index.delta? platform=android&dev=true&minify=false:112892)

Unexpected token ';' (http://10.0.2.2:8081/index.delta? platform=android&dev=true&minify=false:112892)

I had this working in an IOS build and then noticed react-native i18n updated to 2.0.15 and now I get this weird error. Any help would be greatly appreciated also I did change it to the documentation specs and it still had an error. eslint in running.

Maybe a fresh set of eyes will help.

Thank you for taking the time to look at this post

Upvotes: 2

Views: 2100

Answers (1)

Frederik Voordeckers
Frederik Voordeckers

Reputation: 1331

I had the same issue. No clue where to start. Turns out that if one of your translation files is just empty (not even containing {}) it will throw this error.

Solved it by providing all the translation files with content, at least {} to make it a valid json file.

Opened this ticket.

Upvotes: 8

Related Questions