Fix error ERR_INVALID_ARG_TYPE deploying to Firebase hosting

If you're trying to deploy a website to Firebase hosting and you're getting an error like the one below after you run firebase deploy, let me help you fix it.

$ firebase deploy

=== Deploying to 'my-firebase-app'...

i  deploying storage, firestore, functions, hosting
Running command: npm --prefix "$RESOURCE_DIR" run build

> functions@ build /Users/antonio/Projects/my-firebase-app/functions
> tsc

✔  functions: Finished running predeploy script.

Error: An unexpected error has occurred.

You can find additional details about the error in the file firebase-debug.log in your project folder. In my case it contained the following error info:

[debug] [2021-02-18T08:47:13.418Z] TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at validateString (internal/validators.js:120:11)
    at Object.join (path.js:1039:7)
    at Config.path (/Users/antonio/.nvm/versions/node/v12.18.3/lib/node_modules/firebase-tools/lib/config.js:126:39)
    at RulesDeploy.addFile (/Users/antonio/.nvm/versions/node/v12.18.3/lib/node_modules/firebase-tools/lib/rulesDeploy.js:33:46)
    at /Users/antonio/.nvm/versions/node/v12.18.3/lib/node_modules/firebase-tools/lib/deploy/storage/prepare.js:23:21
    at Array.forEach (<anonymous>)
    at default_1 (/Users/antonio/.nvm/versions/node/v12.18.3/lib/node_modules/firebase-tools/lib/deploy/storage/prepare.js:19:17)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
[error]
[error] Error: An unexpected error has occurred.

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

This might not seem very helpful but with the two error messages, we have enough info to fix it. The first thing we can try is to deploy just our website to Firebase hosting instead of trying to deploy the whole project. For that we just need to run firebase deploy --only hosting. If that works we're in the right path. However if you need to deploy other components, like Firebase functions and you prefer to deploy your whole project together running firebase deploy there is something you can check.

The error The "path" argument must be of type string. Received undefined indicates that there is an error inside the firebase.json file of your project. Most likely, you'll have some of the services enabled (like storage) without any of the required parameters. See below one example of an incorrect firebase.json file:

{
  "hosting": {
    "public": "dist",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  },
  "firestore": {
    "rules": "firestore.rules"
  },
  "storage": {}, // ⚠️🔥 Here is the issue ⚠️🔥
  "emulators": {
    "functions": {
      "port": 5001
    },
    "firestore": {
      "port": 8080
    },
    "hosting": {
      "port": 5000
    },
    "ui": {
      "enabled": true
    }
  },
  "functions": {
    "predeploy": ["npm --prefix \"$RESOURCE_DIR\" run build"]
  }
}

When you run firebase deploy the CLI will read your firebase.json file to identify which services it has to deploy. In the file above, it will try to deploy to Firebase Hosting, then Firestore and finally Storage however, as the storage key in the file is empty, it will fail and throw the error The "path" argument must be of type string. Received undefined. We can fix this by removing that line from the firebase.json or configure properly following the firebase documentation.

Hope you find this useful.

Happy coding ✌️

Fix error ERR_INVALID_ARG_TYPE deploying to Firebase hosting

Other articles that might help you

Basic tips for your first Firebase project

Firestore pagination with Vuexfire

my projects

theLIFEBOARD.app

SolidityTips.com

Quicktalks.io