Fix error ERR_INVALID_ARG_TYPE deploying to Firebase hosting

Last updated

Antonio Ufano avatar

Antonio Ufano

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 ✌️

If you enjoyed this article consider sharing it on social media or buying me a coffee ✌️

Oh! and don't forget to follow me on Twitter where I share tons of dev tips 🤙

Other articles that might help you

my projects

Apart from writing articles in this blog, I spent most of my time working on my personal projects.

lifeboard.app logo

theLIFEBOARD.app

theLIFEBOARD is a weekly planner that helps people achieve their goals, create new habits and avoid burnout. It encourages you to plan and review each week so you can easily identify ways to improve your productivity while keeping track of your progress.

Request early access
quicktalks.io logo

Quicktalks.io

Quicktalks is a place where indie hackers, makers, creators and entrepreneurs share their knowledge, ideas, lessons learned, failures and tactics they use to build successfull online products and businesses. It'll contain recorded short interviews with indie makers.

Message me to be part of it