[Fixed] Firebase NPM errors

Introduction

Recently, I have started working with Firebase (https://firebase.google.com/). This is great for creating serverless Node Js apps.

However there can be problems to get started - usually around Firebase NPM errors or issues. This post I will go over some common errors that I have encountered and their fixes!

A few errors that comes up when installing firebase with npm: npm install firebase:

12379 verbose lifecycle grpc@0.13.1~install: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bi..............

12380 verbose lifecycle grpc@0.13.1~install: CWD: /home/"username"/Firebase-Plays-GCP-2016/backend/game-controller/node_modules/grpc
12381 silly lifecycle grpc@0.13.1~install: Args: [ '-c', 'node-pre-gyp install --fallback-to-build' ]
12382 silly lifecycle grpc@0.13.1~install: Returned: code: 1  signal: null
12383 info lifecycle grpc@0.13.1~install: Failed to exec install script
12384 verbose unlock done using /home/"Username"/.npm/_locks/staging-6598b7ab8d64c375.lock for /home/"Username"/Firebase-Plays-GCP-2016/backend/game-controller/node_modules/.staging
12385 verbose stack Error: grpc@0.13.1 install: `node-pre-gyp install --fallback-to-build`
12385 verbose stack Exit status 1
12385 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:280:16)
12385 verbose stack     at emitTwo (events.js:126:13)
12385 verbose stack     at EventEmitter.emit (events.js:214:7)
12385 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
12385 verbose stack     at emitTwo (events.js:126:13)
12385 verbose stack     at ChildProcess.emit (events.js:214:7)
12385 verbose stack     at maybeClose (internal/child_process.js:925:16)
12385 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
12386 verbose pkgid grpc@0.13.1
12387 verbose cwd /home/"Username"/Firebase-Plays-GCP-2016/backend/game-controller
12388 verbose Linux 4.10.0-40-generic
12389 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "install"
12390 verbose node v8.9.2
12391 verbose npm  v5.5.1
12392 error code ELIFECYCLE
12393 error errno 1
12394 error grpc@0.13.1 install: `node-pre-gyp install --fallback-to-build`

Tip: Know the difference between firebase and firebase-tools

• npm install firebase is the actual SDK that you will use to work with your app - for example authentication, storage, messaging, etc.
• npm install firebase-tools - this is the actual command line interface (CLI) that you will use to setup your projects. So before doing anything else, make sure this package is installed!

The two terms can be confusing since after we have installed firebase-tools CLI, to use the CLI the command is actually firebase - eg firebase init. I got confused between the SDK and the actual CLI command :)

Tip 1 - Install firebase-tools first

The first thing to do with any firebase project is to install firebase-tools. This allows to setup the project and later do things like emulation or deploy to Google Cloud.

To

Fix issues with Firebase NPM install errors

Now sometimes, we can get errors when trying to install firebase tools. This can come down to permissions or firebase-tools already exists on our system.

An example of this error is:

npm ERR! code EEXIST
npm ERR! path C:\Users\user\AppData\Roaming\npm\node_modules\firebase-tools\lib\bin\firebase.js
npm ERR! dest C:\Users\user\AppData\Roaming\npm\firebase
npm ERR! EEXIST: file already exists, cmd shim 'C:\Users\user\AppData\Roaming\npm\node_modules\firebase-tools\lib\bin\firebase.js' -> 'C:\Users\user\AppData\Roaming\npm\firebase'
npm ERR! File exists: C:\Users\user\AppData\Roaming\npm\firebase
npm ERR! Remove the existing file and try again, or run npm
npm ERR! with --force to overwrite files recklessly.

(If you are on Windows, go to your Roaming folder and clear out the firebase modules - eg C:\Users\user\AppData\Roaming\npm\firebase)

Additionally, open up the terminal and run the following commands to clear your install and get a fresh firebase-tools to work with.

• npm uninstall -g firebase-tools

• npm cache clean --force

• npm install -g firebase-tools

In Linux or OSX, if you are getting permission errors, make sure to use sudo in front of the commands:

For Windows, make sure to open the terminal in Administrator mode. After you have installed firebase-tools, in Windows, we need to open up a new terminal to start using it.

Tip 2 - Clean your NPM cache

After we have setup our project with firebase-tools, we can go ahead and install firebase SDK. If you are seeing NPM errors in this stage we can try to clear the cache with the following:

npm cache clean --force

When NPM installs modules, it keeps a cache of the downloaded files. This will be ~/.npm on Posix, or %AppData%/npm-cache on Windows.

So when the next time you try to install the same package and its dependencies, it will go to the cache folder and not waste time downloading it again.

NPM cache is usually advertised as “self healing”, however I have found that I need to run this a few times!

Tip 3 - Check for NPM peer dependency conflicts!

One issue that can come up when you run npm install firebase is conflicting peer dependencies.

A example of a error of project using React is as follows:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: 3d-react-carousal@5.0.0
npm ERR! Found: react@18.1.0
npm ERR! node_modules/react
npm ERR!   peer react@">=16.8.0" from @restart/hooks@0.4.7
npm ERR!   node_modules/@restart/hooks
npm ERR!     @restart/hooks@"^0.4.0" from @restart/ui@1.2.0
npm ERR!     node_modules/@restart/ui
npm ERR!       @restart/ui@"^1.2.0" from react-bootstrap@2.3.1
npm ERR!       node_modules/react-bootstrap
npm ERR!         react-bootstrap@"^2.3.1" from the root project
npm ERR!     @restart/hooks@"^0.4.6" from react-bootstrap@2.3.1
npm ERR!     node_modules/react-bootstrap
npm ERR!       react-bootstrap@"^2.3.1" from the root project
npm ERR!   peer react@">=16.14.0" from @restart/ui@1.2.0
npm ERR!   node_modules/@restart/ui
npm ERR!     @restart/ui@"^1.2.0" from react-bootstrap@2.3.1
npm ERR!     node_modules/react-bootstrap
npm ERR!       react-bootstrap@"^2.3.1" from the root project
npm ERR!   15 more (@testing-library/react, prop-types-extra, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.2" from 3d-react-carousal@5.0.0
npm ERR! node_modules/3d-react-carousal
npm ERR!   3d-react-carousal@"^5.0.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react@17.0.2

If you are using NPM 7.x or higher, this will most likely break your code than with NPM version 6.x or below.

One key difference with NPM version 7.x is that it installs peer dependencies by default!

For more information on Fixing conflicting peer dependency errors

We see this issue most commonly with React v17+ projects (or version 18 now) - various components don’t list their peer dependencies and we end up with this error!

Allot of React modules did not include the peer dependency of React v17 and when you run npm install, the conflicting dependency error appears.

Since NPM version 7.x requires peer dependencies to be explicitly specified, this error will fire whenever a module (or any of its own dependencies) lists a previous major version of React as a peerDependency without specifically including React v17 as well.

A simple fix for this to try npm install firebase --legacy-peer-deps.

However, the actual fix is to go through your project and figure out which peer dependency requires update.

💡 Understanding peer dependencies

A peer dependency is similar to regular dependencies, but they do not have a “strong” link between packages. They can exist without the package being installed.

As an example, lets say that we are building a calendar component for React - “awesome-calendar”. This allows people with React projects to use. We then have the following peer dependencies:

"peerDependencies": {
  "react": "^17.0.1",
  "react-dom": "^17.0.1"
}

This just means that our calendar component will require React version 17 and React-Dom version 17.

Now if we import the “calendar” component into our project and do not have React and React-Dom version 17, NPM will complain!

It is up to the developer that is using our component to have those React and React-Dom versions in their projects! If not, then the unable to resolve dependency tree error will appear!

For more information check out the Node website: https://nodejs.org/en/blog/npm/peer-dependencies/

Tip 4 - Check your permissions to install NPM packages

Another error that comes up is with permissions. Make sure that you are running with sudo on Linux (or OSX) and under “Administrator” in Windows terminal

sudo npm install -g firebase

An example error message that comes up if you have permission issues (EACCES):

node-pre-gyp WARN Using needle for node-pre-gyp https download
node-pre-gyp WARN Pre-built binaries not installable for grpc@1.17.0 and node@10.15.0 (node-v64 ABI, glibc) (falling back to source compile with node-gyp)
node-pre-gyp WARN Hit error EACCES: permission denied, mkdir '/usr/lib/node_modules/firebase/node_modules/grpc/src/node'
gyp WARN EACCES user "root" does not have permission to access the dev dir "/home/dustin/.node-gyp/10.15.0"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/lib/node_modules/firebase/node_modules/grpc/.node-gyp"
gyp WARN install got an error, rolling back install

To solve EACCES permission errors, you can follow two options:

1. Reinstall npm with a node version manager (recommended). More information here: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
2. Manually change npm’s default directory - To minimize the chance of permissions errors, you can configure npm to use a different directory!

If you are on Linux (or OSX) and want to try option 2 - manually set NPM default directory, open up the terminal and use the following steps:

First go to the home directory.

• mkdir ~/.npm-global

• npm config set prefix '~/.npm-global'

In your preferred text editor, open or create a ~/.profile file and add this line:

• export PATH=~/.npm-global/bin:$PATH

On the command line, update your system variables:

• source ~/.profile

To test your new configuration, install a package globally without using sudo:

npm install -g firebase-tools

Summary

In this post, I went over several firebase NPM errors that we can encounter when working with firebase projects.

We need to make sure that we have first successful installed firebase-tools, check that we have the correct permissions to install with NPM (using sudo if running under Linux or run under Administrator in Windows), make sure that our existing project does not have any conflicting peer dependencies.

With peer dependency conflicts, one option is to use the --legacy-peer-deps flag or downgrade NPM to version 6. NPM version 7 forces to install peer dependencies where version 6 is more relaxed!