2

When i try to render nuxt in firebase functions, i get an "User code failed to load. Cannot determine backend specification" error.

Other functions can be deployed, but only the nuxt function fails whether the mode is SSR or SPA.

I looked at the logs and found no useful information.

And when i looked into the "Cannot determine backend specification" error, i couldn't find anyone else with the same error, so i couldn't figure out a solution myself.

If anyone can help me, I would appreciate it if you could tell me how to solve this problem.

Thank you.

functions/index.js:

const functions = require('firebase-functions')
const { Nuxt } = require('nuxt')

const config = require('./nuxt.config.js')
const nuxt = new Nuxt(config)

exports.nuxtServer = functions.https.onRequest(async (request, response) => {
const result = await nuxt.renderRoute(request.originalUrl, { request })
response.send(result.html)
})

functions/package.json:

{
 "name": "functions",
 "description": "Cloud Functions for Firebase",
 "scripts": {
   "build": "nuxt build",
   "serve": "npm run build && firebase serve --only functions",
   "shell": "npm run build && firebase functions:shell",
   "start": "nuxt start",
   "dev": "nuxt",
   "deploy": "firebase deploy --only functions",
   "logs": "firebase functions:log",
   "generate": "nuxt generate"
 },
 "engines": {
   "node": "14"
 },
 "main": "index.js",
   "dependencies": {
   "@nuxtjs/axios": "^5.13.6",
   "core-js": "^3.19.3",
   "firebase": "^9.10.0",
   "firebase-admin": "^10.0.2",
   "firebase-functions": "^3.18.0",
   "nuxt": "^2.15.8",
   "vue": "^2.6.14",
   "vue-server-renderer": "^2.6.14",
   "vue-template-compiler": "^2.6.14",
   "vuetify": "^2.6.1",
   "webpack": "^4.46.0"
 },
 "devDependencies": {
   "firebase-functions-test": "^0.2.0",
   "@nuxtjs/vuetify": "^1.12.3"
 },
 "private": true
}
Doug Stevenson
  • 297,357
  • 32
  • 422
  • 441
Yuu
  • 21
  • 1
  • You should probably use `import` rather than `require` in modern JS apps. Then, what is that one doing? Rendering a route thanks to a serverless function? This is a thing that you saw somewhere? (I never knew the existence of such thing) – kissu Sep 17 '22 at 20:57
  • @kissu The nuxtServer function seems to handle displaying pages built with nuxt when a page is requested by firebase hosting. I referred to this article (this article is in Japanese and describes how to deploy to firebase with nuxt in SPA mode). https://qiita.com/aki319809/items/9c0dc31bd150eac17007 In the functions folder, i got a "Failed to load function definition from source: Failed to generate manifest from function source: SyntaxError: Cannot use import statement outside a module" error when i used import. – Yuu Sep 18 '22 at 08:42
  • Google the last part of your error or try that solution: https://stackoverflow.com/a/68558580/8816585 – kissu Sep 18 '22 at 10:49
  • @kissu I was able to resolve the import error using the method you gave me. However, i still get the "Cannot determine backend specification" error. It was able to deploy until a few months ago... – Yuu Sep 19 '22 at 12:55
  • For the rest, I suppose that some things have probably moved and required some updates. It's now obsolete, hence why the build doesn't work anymore. Try to look into Github issues/communities/documentation to know the exact changelog. – kissu Sep 19 '22 at 13:04
  • 1
    @kissu There may be a compatibility issue between nuxt and firebase versions. I will look into that. Thanks. – Yuu Sep 20 '22 at 10:57
  • @Yuu were you able to fix it? I face the same issues, please see https://stackoverflow.com/questions/75634743/nuxt-js-problematic-nuxt-config-js-ts-with-firebase-cloud-functions-while-deploy – Daniel Danielecki Mar 04 '23 at 09:25

0 Answers0