Firebase auth PROVIDER_ID is undefined

• Operating System version: macOS High Sierra 10.13.6
• Browser version: Chrome Version 68.0.3440.106
• Firebase UI version: firebaseui 3.4.1
• Firebase SDK version: 5.5.0
• Node: 8.11.1

I’m using react 16.5.0 and receiving the following error “Cannot read property ‘PROVIDER_ID’ of undefined”

I initialize firebase in a config file and import firebase and firebaseui like so

import firebase from '../config.js';
import firebaseui from 'firebaseui';

I’m able to use firebase.auth() in the same file. So I know firebase was initialized and is working.

firebase.auth().signInWithEmailAndPassword(username, password)

I enabled the Email/Password signin provider in the project console. Below is the code that I have in my componentDidMount() method.

 var uiConfig = {
      signInSuccessUrl: '/home',
      signInOptions: [firebase.auth.EmailAuthProvider.PROVIDER_ID]
 }

var ui = new firebaseui.auth.AuthUI( firebase.auth() );
ui.start('#firebaseui-auth-container', uiConfig);

Is anyone else running into this or have an idea what’s going on?

[joshkuhar]

@wti806 You are correct! I’m not sure why the auth() was working after initializing firebase and then exporting. I exported the config object and then initialized in the component. Thanks!

'use strict';

import React, {Component} from 'react';
import config from '../config.js';
import * as firebase from 'firebase';
import * as firebaseui from 'firebaseui';

const db = firebase.initializeApp(config);

const uiConfig = {
    signInSuccessUrl: '/',
    signInOptions: [ firebase.auth.EmailAuthProvider.PROVIDER_ID ],
    tosUrl: '/'
};

class Login extends Component {
    constructor(props) {
        super(props)
        this.state = {
            error: ''
        }
    }
    componentDidMount() {
        var ui = new firebaseui.auth.AuthUI(firebase.auth());
        ui.start('#firebaseui-auth-container', uiConfig);
    }
    render() {
        return <div id="firebaseui-auth-container"></div>
    }
} 

export default Login;

[wti806]

@joshkuhar Don’t you need to export the firebase object from config.js?