nuxt/firebase + Vercel SSR?

[cfofiu]

I've been trying to deploy my Nuxt SSR app build with nuxt/firebase on Vercel and it keeps throwing the following errors:

WARN Error enabling offline persistence. Falling back to persistence disabled: TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

[sergiocerrutti]

Hey @cfofiu, can you share your firebase options? Only options like "services", etc., not the private config. Also do you have any now.json or vercel.json in your app?

[cfofiu]

@sergiocerrutti this is really it (from nuxt.config.js):

modules: [
    '@nuxtjs/firebase',
],

// Firebase module
firebase: {
    config: {
        apiKey: process.env.firestore_apikey,
        authDomain: fbConfig.firestore_authDomain,
        databaseURL: fbConfig.firestore_databaseURL,
        projectId: fbConfig.firestore_projectId,
        storageBucket: fbConfig.firestore_storageBucket,
        messagingSenderId: fbConfig.firestore_messagingSenderId,
        appId: fbConfig.app_id,
        measurementId: fbConfig.messaging_sender_id
    },
    services: {
        auth: true,
        firestore: true,
        functions: true,
        storage: true
    }
},
functions: {
    location: 'us-central1',
    emulatorPort: 12345
},

and the vercel.json is:

{
  "version": 2,
  "rewrites": [
    { "source": "/strategy/:shareId", "destination": "/" },
    { "source": "/property/:profileId", "destination": "/" },
  ],
    "trailingSlash": false,
    "regions": ["iad"]
}

If you happen to have a working sample for Firebase Nuxt SSR deployment that you can share, I could try to figure out what I'm doing wrong.

[sergiocerrutti]

Hey @cfofiu, sorry for the delay, I'm really busy these days...

Here is my vercel.json:

{
  "version": 2,
  "builds": [
    {
      "src": "nuxt.config.js",
      "use": "@nuxtjs/now-builder",
      "config": {
        "serverFiles": [
          "middleware/**",
          "plugins/**",
          "lib/**",
          "package.json"
        ]
      }
    }
  ],
  "routes": [
    {
      "src": "/_nuxt/.+",
      "headers": {
        "cache-control": "s-maxage=31536000"
      }
    },
    {
      "src": "/(.*)",
      "dest": "$1"
    }
  ]
}

Also my Vercel build config is set to Nuxt.js, but I think this is overridden by the build option in my config.

My Firebase config inside nuxt.config.js:

['@nuxtjs/firebase', {
  config: {
    ...
  },
  services: {
    auth: {
      initialize: {
        onAuthStateChangedAction: 'auth/onAuthStateChanged'
      },
      ssr: true
    },
    firestore: {
      memoryOnly: false
    },
    storage: true
  }
}]

Try to add ssr: true to the auth service. Also I don't use cloud functions, maybe you can try to disable them in order to check if the error comes from there. My project works perfectly in Vercel with that config.

[imprakharshukla]

Hey! Did you find any solutions to this? I'm facing the same issue with Firebase and confused where it's coming from.

[lupas]

I never used vercel, but I just stumbled upon that: https://nuxtjs.org/docs/2.x/deployment/vercel-deployment/#service-worker-with-nuxt-pwa-module

Since ssr: true uses the PWA module that uses a service worker, you might need to add that sw.js part to your vercel-config.

Not tested, but just an idea.

[lupas]

Closing due to inactivity.

[adarsh4d]

Having the same issue #557

@cfofiu Did you find any solution for this?

[MrAyush]

Here is a workaround Why this happens (see the full issue @nuxtjs/vercel-builder #41)

export default {
  build: {
    extend(config, { isServer }) {
      if (isServer) {
        config.externals = {
          '@firebase/app': 'commonjs @firebase/app',
          '@firebase/auth': 'commonjs @firebase/auth',
          '@firebase/firestore': 'commonjs @firebase/firestore',
          // ...
        }
      }
    }
  }
}