Hello, expo team and community! How I can connect Firebase to Expo Go and after that to complete app? For example, I have started to create a project, which I want to test on Expo GO. I use command: “npm i -S firebase”. And then I want to use some function like: “firebases.auth()…” but Expo Go does not see this function → typeerror: _app.firebase.auth is not a function. (In ‘_app.firebase.auth()’, '_app.firebase.auth is undefined). What should I do? Commands for conntect Firebase to Expo Go and Firebase to complete app(apk.) are different or same?
This code App.js:
import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
//import * as firebase from 'firebase';
//import { firebase } from '@firebase/app';
//import * as firebase from '@firebase/app';
import {firebase} from '@firebase/app';
const firebaseConfig = {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
measurementId: ""
};
!firebase.apps.length ? firebase.initializeApp(firebaseConfig) : firebase.app()
import { Container, Content, Header, Form, Input, Item, Button, Label} from 'native-base';
export default class App extends React.Component {
constructor(props)
{
super(props)
this.state = ({
email:'',
password:''
})
}
signUpUser = (email, password) => {
try{
if(this.state.password.length < 6)
{
alert("Please, enter atleast 6 characters");
this.return;
}
firebase.auth().createUserWithEmailAndPassword(email, password);
}
catch(error){
console.log(error.toString());
}
}
loginUser = (email, password) => {
}
render(){
return (
<Container style={styles.container}>
<Form>
<Item floatingLabel>
<Label>Email</Label>
<Input
autoCorrect = {false}
autoCapitalize = "none"
onChangeText = {(email) => this.setState({email})}
/>
</Item>
<Item floatingLabel>
<Label>Password</Label>
<Input
secureTextEntry = {true}
autoCorrect = {false}
autoCapitalize = "none"
onChangeText = {(password) => this.setState({password})}
/>
</Item>
<Button style={{marginTop: 10}}
full
rounded
success
onPress = {() => this.loginUser(this.state.email, this.state.password)}
>
<Text style = {{color: '#fff'}}>Login</Text>
</Button>
<Button style={{marginTop: 10}}
full
rounded
primary
onPress = {() => this.signUpUser(this.state.email, this.state.password)}
>
<Text style = {{color: '#fff'}}>Sign Up</Text>
</Button>
</Form>
</Container>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
justifyContent: 'center',
padding: 10
},
});
P.S. I have hidden some data from firebaseConfig.