How to correct error with React-Redux-Firebase in Redux store

Question

I am trying to implement React-Redux-Firebase in a Redux store with the following code:

store.js

import { applyMiddleware, compose, createStore } from 'redux';
import reducers from 'store/reducers';
import thunk from 'redux-thunk';
import { reduxFirestore, getFirestore } from 'redux-firestore';
import { reactReduxFirebase, getFirebase } from 'react-redux-firebase';
import AppConfig from 'my-app/AppConfig';

const composeEnhancers =
  typeof window === 'object' &&
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({}) : compose;

const enhancer = composeEnhancers(
  applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
  reduxFirestore(AppConfig.fbConfig),
  reactReduxFirebase(AppConfig.fbConfig),
);

const store = createStore(reducers, enhancer); // this line generates the error message

export default store;

Apparently, the line:

const store = createStore(reducers, enhancer);

throws the following error message:

Error: v2.0.0-beta and higher require passing a firebase app instance or a firebase library instance. View the migration guide for details.

Can anyone help me understand what this error message means? And how I can fix it?

Answer 1

Do not make a class. Use it like this:

import firebase from 'firebase/app'
import 'firebase/firestore'
import 'firebase/auth'

var config = {
  apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
  authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  databaseURL: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  projectId: "xxxxxxxxxxxxxxxxxxxxxx",
  storageBucket: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx",
  messagingSenderId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
};
firebase.initializeApp(config);

  export default firebase;