bundling failed: SyntaxError: Unexpected end of JSON input in react native

Question

i am using firebase in my react native project. when i am try to sign up user with email and password this error is comming. i am using window OS and only andorid render

Note: i had read all questions related to this but nothing helped

newbiew to react native .please guide in proper way

package.json

"firebase": "^5.8.2",
    "native-base": "^2.11.0",
    "react": "16.6.3",
    "react-native": "^0.57.8",
    "react-native-elements": "^0.19.1",
    "react-native-firebase": "^5.2.2",
    "react-native-gesture-handler": "^1.0.15",
    "react-native-maps": "^0.23.0",
    "react-native-svg": "^8.0.10",
    "react-native-vector-icons": "^6.2.0",
    "react-navigation": "^3.2.1"

Code for sign up

import * as firebase from 'firebase'

//Intiazlize firebase
const firebaseConfig = {
    apiKey: "AIzaSyCUK5QkcvTcvfCKlbwnnI8GskIgcLGMcqA",
    authDomain: "trailertracker-da09c.firebaseapp.com",
    databaseURL: "https://trailertracker-da09c.firebaseio.com",
    projectId: "trailertracker-da09c",
    storageBucket: "",
}


firebase.initializeApp(firebaseConfig)

 signUpUser = (email,password) => {
        try{
            if(this.state.password.length < 6 ){
                alert("Please Enter Valid Email and Password")
                return
            }

            firebase.auth().createUserWithEmailAndPassword(email,password)

        } catch(err){
            console.log(err)
        }
    }

Complete error is

Loading dependency graph, done. error: bundling failed: SyntaxError: Unexpected end of JSON input at JSON.parse () at FileStore.get (F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\stores\FileStore.js:26:19) at F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\Cache.js:76:40 at Generator.next () at step (F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\Cache.js:18:30) at F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\Cache.js:37:14 at new Promise () at F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\Cache.js:15:12 at Cache.get (F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro-cache\src\Cache.js:102:7) at F:\React Native\ReactProjects\trailer-tracker\TrailerTracker\node_modules\metro\src\DeltaBundler\Transformer.js:166:34 BUNDLE [android, dev] ....../index.js 68.2% (947/1147), failed.

is this another error or error in firebase ?

Help will be highly appreciated

Thanks

Is that the exact content of your package.json fiile? If it is then just try to surround it in curly braces. The whole file must be a valid JSON object. — cglacet

Muhammad Ashfaq Muhammad Ashfaq · Accepted Answer · 2019-07-17T12:41:57

To get started with firebase in react native.

add firebase dependency

yarn add firebase

Goto Firebase and make a new project and going to the section Add Firebase to your web app

Make a class for configation of Firebase like this

import firebase from "@firebase/app";
require("firebase/database");
require("firebase/storage");
require("firebase/auth");

let config = {
  apiKey: "YOUR PROJECT apiKey",
  authDomain: "YOUR PROJECT authDomain",
  databaseURL: "YOUR PROJECT databaseURL",
  projectId: "XXXXXXXX",
  storageBucket: "",
  messagingSenderId: "XXXXXXXXXX",
  appId: "XXXXXXXXXXXXXXXXXXXXXXXX"
};

export default class DBHandler {
  static auth;
  static database;

  static init() {
    firebase.initializeApp(config);
    DBHandler.database = firebase.database();
    DBHandler.auth = firebase.auth();
  }
}

in App.js initialize Firebase

import DBHanlder from "./src/api/constants";

export default class App extends Component {
  componentDidMount = () => {

    DBHanlder.init();
  };

  render() {
    return <YourApp />;
  }
}

Your're done with initialization part .now you can use for auth like below

import DBHandler from "../api/constants";
class Login extends Component {

signinUser = () => {
DBHandler.auth.signInWithEmailAndPassword(email, password)
        .then(() => {
          //Do what you want
        })
        .catch((error) => {
          //handle error
          var errorCode = error.code;
          var errorMessage = error.message;
          alert(errorMessage);
          console.log("ERROR");
          console.log(errorCode, errorMessage);
        });
    }
}}

bundling failed: SyntaxError: Unexpected end of JSON input in react native

1 Answers