Firebase-js-sdk: Problem with typescript if firebase and firebase-admin live in the same node_modules.

[richtera]

[REQUIRED] Describe your environment

I have a node env that has some client side and server side code during development.
So both firebase and firebase-admin are in the same place.
There seems a bunch of warnings like:

warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/auth > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/database > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/firestore > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/functions > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/storage > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".

But when I install @firebase/app-types then the client side version of firebase no longer seems to work and firebase.database is no longer a function.

• Operating System version: _____
• Firebase SDK version: _____
• Firebase Product: _____ (auth, database, storage, etc)

Add both firebase and firebase-admin and @firebase/app-types.

[REQUIRED] Describe the problem

Steps to reproduce:

Relevant Code:

https://stackblitz.com/fork/firebase-issue-sandbox

// TODO(you): code here to reproduce the problem

[google-oss-bot]

Hey there! I couldn't figure out what this issue is about, so I've labeled it for a human to triage. Hang tight.

[google-oss-bot]

This issues does not have all the required information. Looks like you forgot to fill out some sections. Please update the issue with more information.

[richtera]

Basically if you have a webpack firebase project, then install firebase-admin since you might have some tools that use it during dev. Yarn will give you these missing dependencies warnings. After you fix them firebase for the browser is broken but the firebase-admin for the tools still works. There seems to be some sharing of modules in some incompatible way. I have to out all tools into a new folder along with a new package.json so I could separated the two firebase and firebase-admin module and their dependencies.

[richtera]

It might only happen with a typescript project

[richtera]

This was my original folder with yarn install:

yarn install
yarn install v1.6.0
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning "firebase-admin > @firebase/[email protected]" has unmet peer dependency "@firebase/app-types@^0.1.0".
warning "firebase-admin > @firebase/database > @firebase/[email protected]" has unmet peer dependency "@firebase/app-types@^0.1.0".
warning " > [email protected]" has incorrect peer dependency "mobx@^2.5.0 || ^3.0.0".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/auth > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/database > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/firestore > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/functions > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning "firebase > @firebase/storage > @firebase/[email protected]" has unmet peer dependency "@firebase/[email protected]".
warning " > [email protected]" has incorrect peer dependency "react@^0.14.7".
warning " > [email protected]" has incorrect peer dependency "react-dom@^0.14.7".
warning "react-d3-basic > [email protected]" has incorrect peer dependency "react@^0.14.7".
warning "react-d3-basic > [email protected]" has incorrect peer dependency "react-dom@^0.14.7".
warning "react-d3-basic > [email protected]" has incorrect peer dependency "react@^0.14.7".
warning "react-d3-basic > [email protected]" has incorrect peer dependency "react-dom@^0.14.7".
warning " > [email protected]" has incorrect peer dependency "webpack@^2.0.0 || ^3.0.0".

$ yarn list --pattern firebase
yarn list v1.6.0
├─ @firebase/[email protected]
├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ [email protected]
│  ├─ @firebase/[email protected]
│  ├─ @firebase/[email protected]
│  ├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
└─ [email protected]

After fixing the @firebase/[email protected] problems by installing @firebase-app-typesmy web application no longer runs and says firebase.database is not a function.

yarn add @firebase/app-types

$ yarn list --pattern firebase
yarn list v1.6.0
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ [email protected]
│  ├─ @firebase/[email protected]
│  ├─ @firebase/[email protected]
│  ├─ @firebase/[email protected]
│  ├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
└─ [email protected]
✨  Done in 1.13s.

Separating the two packages one with firebase and the other with firebase-admin does fix the problem but it requires a whole bunch of code changes in my system. We have had a merged packages with firebase and firebase-admin for the last year or so with no problems but since we're using typesscript these warnings are not glaring us in the face :).

This is now my setup:

$ yarn list --pattern firebase
yarn list v1.6.0
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
└─ [email protected]
✨  Done in 1.30s.

tools folder
$ (cd lib; yarn list --pattern firebase)
yarn list v1.6.0
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
│  └─ @firebase/[email protected]
├─ @firebase/[email protected]
├─ @firebase/[email protected]
└─ [email protected]
✨  Done in 0.37s.

[jshcrowthe]

I've seen several issues with peerDependencies throwing benign warnings with yarn. Can you replicate the same issues using npm?

[richtera]

The peerDependency warning don't worry me so much. The problem is fixing them causes a failed build because it seems @firebase/app-types (and most likely @firebase/app) seems to be incompatible between the current version of firebase and firebase-admin.

[jshcrowthe]

Ohhh, I see.

@hiranya911, I think we need to bump the firebase-admin dependency on @firebase/app. Can you confirm?

[richtera]

I am just a bit concerned that firebase and firebase-admin use shared modules in the first place. Unless the api between the modules is pretty solid this kind of thing could happen any time. Maybe there is a way to combine firebase-admin into the firebase module and just have firebase-admin be a stub? :) I know that might be hard.

[Salakar]

Having the same issue here - firebase + firebase-admin in the same NodeJS project (a testing suite project so both are required) and none of the services for firebase are available, as @richtera mentioned they're all undefined so I get undefined is not a function when trying to call firebase.firestore() on the client SDK, Admin seems fine.

[richtera]

The only workaround I found was to put the tools with a package.json containing firebase-admin into a subfolder and then removing firebase-admin from the main project

[isTravis]

Also running into this problem. I server-render some React code that uses firebase on the client-side and generate a token for that client-side code with firebase-admin during that rendering process - hence firebase and firebase-admin in the same package.json.

My work around for the problem (which was hinted at here) was to downgrade to [email protected]. As of firebasev4.8.0, the problem returns.

[LanceSamaria]

I'm experiencing this problem now when trying to access the auth() object. I keep getting an error that says "TypeError: firebase.auth is not a function"

[sk-eran]

same issue
👍

[LanceSamaria]

@sk-eran I got the auth object to appear and the thing I did differently was install the modules in a different order.

The first time I imported the modules (this is when the auth object wasn't appearing):

// this seems to confuse things with the auth object
$ npm install firebase-admin --save
$ npm install firebase --save

I deleted the npm folder and started from scratch although this time I reversed the order:

// for some reason this worked and now I can access the auth object
$ npm install firebase --save
$ npm install firebase-admin --save

I didn't do anything else like delete files or folders I simply reversed the installation order by installing firebase first and firebase-admin second.

I hope this works for other people.

[richtera]

How can you be sure that a npm install or npm ci will preserve that order? If it does you're golden.

[LanceSamaria]

@richtera I honestly can't say what order its going to preserve it in but I do know I constantly tried to delete and reinstall the first way and it never worked. Once I did it the 2nd way it worked (auth appeared) the very first try. Maybe I was lucky I'm not sure? Here is the exact way I installed them along with my other installs and it worked:

$ npm install —-save
$ npm install dotenv --save
$ npm install algoliasearch --save
$ npm install firebase --save
$ npm install firebase-admin --save
$ npm install nodejs-latest
$ npm install -g npm-install-missing

and here is how it looks inside the package.json file:

{
  "name": "npmFolder",
  "version": "1.0.0",
  "description": "Algolia and Firebase Installs",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node app.js"
  },
  "author": "Lance",
  "license": "ISC",
  "engines": {
    "node": "7.8.0"
  },
  "dependencies": {
    "algoliasearch": "^3.27.1",
    "dotenv": "^5.0.1",
    "firebase": "^5.0.2",
    "firebase-admin": "^5.12.0",
    "nodejs-latest": "^1.1.0"
  }
}

[richtera]

What I mean. Is after you do this. You should be able to do

rm -rf node_modules
npm install

If that doesn't work then it's not going to be reliable when loading things in production. I presume you're using --save to be able to later reconstruct the package-lock.json. You might want to try yarn to do the same and maybe that does preserve it. I just put my tool dependencies into another folder.

[rheylen]

I had this issue. I used LanceSamaria's workaround to get the firebase.auth function to show up.

[isTravis]

@jshcrowthe any update on this? With firebase 5.1.0 and firebase-admin 5.12.0 installed in the same node_modules the problem persists.

I've resorted to doing the following, which works - but seems to be unsupported according to the package READMEs:

import firebase from '@firebase/app';
require('@firebase/auth');
require('@firebase/database');

[andrewzey]

@isTravis thanks, that is a life-saver. I can confirm that your workaround works consistently

[jshcrowthe]

Hey all,

So I've had several conversations with @hiranya911 about this over the past couple months. Ultimately the problem here is what @richtera pointed out above:

I am just a bit concerned that firebase and firebase-admin use shared modules in the first place...

firebase and firebase-admin expose exactly the same database API (the admin version simply has admin permissions) so the sharing of code here is warranted. It is more-so the way that we "patch" components onto FirebaseApp that is the problem.

I can do some work to help alleviate this issue by better isolating @firebase/database from @firebase/app, but that will take some time.

There are some things that you can do, in the meantime, to help work around this issue:

1. Ensure that firebase-admin and firebase are always pointed to identical versions of the @firebase/app and @firebase/database packages. This can be done w/ lockfiles, resolve statements or whatever you'd like. Easy way to do this is to simply make sure your firebase package is always up to date w/ the latest major version as that will automatically ensure these dependencies reference the same packages.
2. Don't reference firebase/database. Doing so will throw errors as admin provides it's own patched implementation of database. It is an identical API so you should be good for most (if not all) use cases. If you need firebase/{app,auth} that is fine, ensure that you are only including the pieces that you need (i.e. don't require('firebase'))

It was pointed out by @isTravis that the @firebase scoped packages will work around this issue, I would stay away from that suggestion as part of the fix that I would need to implement to properly fix this will involve a breaking change to those packages (they are major 0, so breaks can come anytime).

[theprojectsomething]

@jshcrowthe are you able to give a clearer example of a workaround in practice in node?

Answering my own question:

const admin = require('firebase-admin');
const client = require('firebase/app');
require('firebase/auth');

// authenticate as a specific user on the server
client.auth().signInWithCredential(client.auth.GoogleAuthProvider.credential(/* auth */));

// for DB access use admin implementation (can't simulate specific user permissions)
admin.database().ref('/').once('value').then(snap => console.log(snap.val()));

[nfarina]

Easy way to do this is to simply make sure your firebase package is always up to date w/ the latest major version as that will automatically ensure these dependencies reference the same packages.

So my packages are at latest and they still depend on different versions of @firebase/app (0.3.3 for firebase, 0.1.10 for firebase-admin). So I'm having the "auth module not found" issue.

@isTravis's workaround does work for me.

[cbess]

Is this going to be resolved soon? I'm still having the issue and the workarounds aren't helping. I'm using VueJS on the client side. I'm using [email protected] and [email protected]

[cbess]

For others, I followed the guidance given on SO to install firebase and firebase-admin in a specific order. It fixed the issue for me.

The workaround for me was to remove the firebase pkg cache from ~/.npm, then remove the firebase/ and firebase-admin and @firebase directories from my proj's node_modules directory. Then, in my proj directory, I first npm i [email protected] and then npm i [email protected]. Started my app and firebase.auth was working as expected. Sad, but true.

Hopefully, it works in production or I don't have to do this at all, because it'll be _actually_ fixed by then.

[Feiyang1]

Tested with the latest firebase and firebase-admin, and I can't reproduce the issue. I'm closing this issue due to inactivity. If you experienced something similar, please open a new issue.

[KPkun]

@sk-eran I got the auth object to appear and the thing I did differently was install the modules in a different order.

The first time I imported the modules (this is when the auth object wasn't appearing):

// this seems to confuse things with the auth object
$ npm install firebase-admin --save
$ npm install firebase --save

I deleted the npm folder and started from scratch although this time I reversed the order:

// for some reason this worked and now I can access the auth object
$ npm install firebase --save
$ npm install firebase-admin --save

I didn't do anything else like delete files or folders I simply reversed the installation order by installing firebase first and firebase-admin second.

I hope this works for other people.

This worked.
Only Solution which worked
Thanks.

[mdrideout]

My Solution: Completely Remove Node, NPM, NVM & Re-Install

I see a lot of people are still winding up here because of SEO.

I posted a solution that worked for me on stack overflow here: https://stackoverflow.com/questions/48592656/firebase-auth-is-not-a-function/54427116#54427116

My fix involves completely removing npm, nvm, and node from my Mac, and doing a clean install with nvm. That link includes all of the steps I took.

[nfarina]

I hate to admit that these steps worked for me:

npm uninstall --save firebase firebase-admin
rm -rf node_modules
rm package-lock.json
rm -rf ~/.npm
npm install
npm install firebase --save
npm install firebase-admin --save

I can't say that they're all necessary, but I did them and it fixed this issue which I've been having for some time. Shrug emoji.

[jahooma]

I got this problem as well.

I think the key is deleting both node_modules and package-lock.json, and then doing a fresh 'npm install'. This will install firebase and firebase-admin in the right order.