GatsbyJS + Firebase : initializeApp is not a function

1103 views reactjs

I am totally stuck.

Have a setup of GatsbyJS 1 with gatsby-next and React 16 + latest Firebase 5.5.7

In develop mode everything works fine, but when I try to make a build I always get: WebpackError: _firebase2.default.initializeApp is not a function

I have already tried all of the following kinds if imports, and all of them result in this error: import firebase from 'firebase'; // const firebase = require('firebase/app') // import * as firebase from 'firebase';

I have tried updating to the latest versions of all libraries. The only one I can't really update at the moment due to lots of migrations is GatsbyJS 2.0

Here is my package.json: "dependencies": { "@material-ui/core": "^3.2.2", "@material-ui/icons": "^3.0.1", "aws-sdk": "^2.345.0", "cookieconsent": "^3.0.6", "firebase": "^5.5.7", "firebaseui": "^3.4.1", "fsevents": "^1.2.4", "gatsby": "^1.9.279", "gatsby-link": "^1.6.46", "gatsby-plugin-google-analytics": "^1.0.20", "gatsby-plugin-i18n": "^0.4.1", "gatsby-plugin-react-helmet": "^1.0.8", "gatsby-plugin-react-next": "^1.0.11", "material-ui-chip-input": "^1.0.0-beta.8", "paypal-checkout": "^4.0.228", "react": "^16.5.2", "react-dom": "^16.5.2", "react-firebaseui": "^3.1.2", "react-intl": "^2.4.0", "reactstrap": "^6.5.0" },

For some time project was running fine on some older versions of libraries.

answered question

1 Answer


As per docs you need to intialize firebase using initializeApp method.

Take a look at

In your code, you can access Firebase using:

const firebase = require('firebase');
const app = firebase.initializeApp({ ... });

If you are using ES6 imports or TypeScript:

import * as firebase from 'firebase';
const app = firebase.initializeApp({ ... });

posted this

Have an answer?


Please login first before posting an answer.