firebase.auth is not a function

Question

I am using Webpack with firebase and firebase-admin.

To install firebase I ran

npm install --save firebase

I am importing firebase

Answer 1

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

This problem has happened to me a few times in the past (whenever I tried up update or install my node_modules). I literally tried everything above. It always seemed to randomly start working and I was unable to use any previously documented solution the next time the error occurred.

I think I may have had some carry-over issues since I started using Firebase in the early days when there were some weird hacks I did in macOS to get firebase to work correctly.

This solution basically completely removes any trace of node / npm / nvm from your Mac, and re-installs it to use the exact version of node that firebase runs. This uses nvm so if you have other projects that require different node versions, you can switch between node versions on the fly.

1. Delete Existing Node Modules

In your project's folder, delete any node_modules folders you have.

2. Remove Node

This is the tutorial I used to manually remove node. In the early days, I remember having to change something to install node into a different directory (due to permission issues), so I also did additional searches on my computer to remove these files and folders from other areas.

3. Remove NPM

This is the tutorial I used to make sure I removed traces of npm

4. Remove NVM

This is the tutorial I used to manually remove NVM

5. Restart

After removing everything and restarting bash (or restarting your Mac as I did for safety) - typing node, npm, and nvm into the console should simply return command not found.

6. Re-Install Node, NPM Using NVM Only

NVM allows you to install a specific version of node. Since I am using the firebase-functions node 8 runtime (beta), I installed their listed target version of node 8. (as of now, node 8.11.1). This is still in beta, firebase functions uses node 6.11.5 as of the time of this writing.

Instructions for installing node, npm using nvm

7. Update NPM Manually

NVM installed an older version of npm. This command updates NPM to its latest version.

npm install npm@latest -g

8. Install Your Modules

Restart your terminal app just in case, then return to your project folder and run the npm install command.

9. Re-Build & Re-Deploy

If you are using webpack, re-build your project. Then deploy or serve locally.

This process solved the problem for me. Hopefully it works for you and you don't have to do any hack stuff. It seems all I needed to do was some cleaning up.

Answer 2

This was a weird error, and I notice it only when installing with npm. For some reason, I don't encounter the issue when using yarn. I didn't have to change imports, like many answers here have suggested, nor any part of my code.

Answer 3

I ran into this as well. My issue was the npm module @firebase was installed as well as the firebase module. When I required firebase in my JavaScript code with ‘require(“firebase”)’, webpack bundled @firebase instead for some reason.

@firebase doesn’t include auth, database etc. by default...it’s modular so you can require them separately. Consequently I received the above error when I tried calling auth().

To fix it you can remove @firebase...or just add the full path to the correct firebase when you require it like

require(‘/path/to/node_modules/firebase/firebase.js’)

Answer 4

just add >

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

into your project

Answer 5

Had the same issue, I think it's because of versions troubles. I solve it by deleting node_modules and all webpack generated stuff and take versions from here.
Btw, I think it's very strange behavior, because it should work like in official documentation.

Answer 6

What-up. I ran into this while working through William Candillon's Adding Firebase To React Native tutorial...

Thoughts: There is a lot to love about Firebase. But the import/export, named vs default and versioning seems to bring a lot of people a lot of unnecessary heart-ache. <-- I say that with tears streaming down my face and a hole in my heart where a love of mobile development & unhappy childhood used to exist mere hours ago.

Put simply: I had firebase.auth is not a function. Went hunting though node_modules, deleted, re-yarn'd, read blogs, tried importing as named then default, requiring separate modules a-la require('firebase/auth'); under the default import of firebase itself etc etc etc (it really shouldn't be this hard). Also, why do Google not have react documentation? It's 2018. Are people seriously still putting HTML script tags in their front end?

Current Solution => in the end I pulled all my config and firebase.initializeApp(config) into my top level app.js. I'll have to find time later to figure out why the "@firebase" module of auth can't be imported. Or why thats even there? Do i need it? Why isn't it all wrapped into the 'yarn add firebase' module?

Anyway - that'd be my advice. Get it working at top level first. Then hive-off the credentials into a separate file later. That and "Dont drink lager. It bloats-you-out and IPA is infinitely nicer."