React - Firebase - GoogleAuthProvider is not a constructor
<p>I am trying to create a React application that uses a "Login with Google" button to trigger <code>signInWithPopup(provider)</code>. However each time I call <code>new firebaseApp.auth.GoogleAuthProvider()</code> my console returns an error. I am simply trying to <code>console.log()</code> the <code>result</code>.</p>

error

<blockquote>
  <p>Uncaught TypeError: _firebase_setup2.default.auth.GoogleAuthProvider is not a constructor</p>
</blockquote>

firebase_setup.js

<pre><code>import * as firebase from 'firebase';

const firebaseConfig = {
  apiKey: "AIzaSyAKlWtFZvbvuNy2qC68Xt5xzaTQVyy9l2o",
  authDomain: "doordash-ff045.firebaseapp.com",
  databaseURL: "https://doordash-ff045.firebaseio.com",
  storageBucket: "doordash-ff045.appspot.com",
};

const firebaseApp = firebase.initializeApp(firebaseConfig);

export default firebaseApp;
</code></pre>

login.js

<pre><code>import React, { Component } from 'react';
import { browserHistory } from 'react-router';
import firebaseApp from '../../../services/firebase_setup';

export default class Login extends Component {

  componentDidMount() {
    firebaseApp.auth().onAuthStateChanged(user =&gt; {
      if (user) {
        console.log(user);
        browserHistory.push('/profile');
      }
    });
  }

  authenticate() {
    var provider = new firebaseApp.auth.GoogleAuthProvider();
    provider.addScope('profile');
    provider.addScope('email');

    firebaseApp.auth().signInWithPopup(provider)
      .then(result =&gt; {
        console.log(result);
      })
  }

  render() {
    return (
      &lt;div&gt;
        &lt;h1&gt;Login Page&lt;/h1&gt;
        &lt;button onClick={this.authenticate.bind(this)}&gt;
          Login with Google
        &lt;/button&gt;
      &lt;/div&gt;

    );
  }
}
</code></pre>

<p>I would appreciate any insight into this issue! I have looked up numerous tutorials but always run into the same error when attempting to declare the <code>provider</code> variable.</p>