How to deploy Nuxt SSR app on firebase using firebase cloud functions and firebase hosting.
Why Stack Overflow recommends it
Stack Overflow users link it as the tutorial they followed when setting up Nuxt SSR on Firebase, usually before asking why their deploy fails.
Recommended by 1 people across 1 different months, 2021 to 2022.
What it is
A 29-minute screencast by M.A.Muhaimin Sakib showing how to deploy a server-side rendered Nuxt app to Firebase using Cloud Functions for rendering and Firebase Hosting for static assets. It follows a linked Medium blog post and a demo GitHub repo, covering the firebase.json setup and predeploy copy steps.
What people said
Recommends Willfrans Varón Sáenz · 2022-04 · Stack Overflow · on “How to deploy Nuxt SSR in Firebase with Cloud functions”
I'm playing with Nuxt in mode SSR and Firebase + Cloud functions, after deploy, everything working fine, no errors in the console from nuxt project, no errors in the functions log, but I got a page with this message: Page Not Found. I've followed this tutorial: [this video] This is my firebase.json { "functions": { "source": "functions", "predeploy": [ "npm run build && rm -rf functions/nuxt && cp -r .nuxt/ functions/nuxt/ && cp nuxt.config.js functions/" ] }, "hosting": { "predeploy": [ "rm -rf public/* && mkdir -p public/_nuxt && cp -r .nuxt/dist/client/ public/_nuxt && cp -a static/. public/" ], "public": "public", "ignore": ["firebase.json", "**/.*", "**/node_modules/**"], "rewrites": [ { "so
Cites Eggon · 2021-07 · Stack Overflow · on “Firebase "cant' resolve" server middleware handler in nuxtjs project ("Can't resolve "~/graphql/index.js" from "/workspace/graphql/index.js")”
I am trying to deploy nuxtjs app as cloud function on Firebase following this tutorial [this video] . I am able to deploy everything (functions and hosting). However, when I try to open the page browser displays Error: could not handle the request . In the function logs I see the following error: FATAL Cannot resolve "~/graphql/index.js" from "/workspace/graphql/index.js" . The path that fails to be resolved is specified in nuxt.config.js in serverMiddleware: serverMiddleware: [{ path: '/graphql', handler: '~/graphql/index.js' }], I tried using ./ instead of ~/ but it changes nothing. I also tried this approach [LINK] , but it also makes no change, same error is thrown. Obviously dev server runs
Cites Eggon · 2021-07 · Stack Overflow · on “Xcopy command throws 'Invalid number of parameters' when run as predeploy of Firebase functions, but works fine when run directly from terminal”
I am trying to host a nuxtjs app on Firebase using cloud functions following this tutorial [this video] (around 12:30). One of the required steps is copying a folder with batch commands in a predeploy hook of firebase deploy --only functions . The tutorial uses Linux (?) commands and I'm trying to replicate it on Windows. I was able to create a command that works correctly (!) if I run it directly from terminal: xcopy .\.nuxt\*.* '.\functions\nuxt\' /e /i /y /q It also works if I put it to package.json as a test script and run it with npm run test (obviously additional \ characters are needed in package.json ): "scripts": { "test": "xcopy .\\.nuxt\\*.* '.\\functions\\nuxt\\' /e /i /y /q" } But wh
Cites thebenCA · 2021-08 · Stack Overflow · on “Nuxt SSR - Firebase Hosting”
Going through the gauntlet of deploying a Nuxt SSR app to firebase hosting. I've been following this fantastic tutorial [this video] . Due to Firebase's limitations with es6-es7, I'm converting my "imports" to "require" and "module.exports". For some reason, when I run firebase deploy --only functions, the deploy fails with the following error: import colors from 'vuetify/es5/util/colors' ^^^^^^ SyntaxError: Cannot use import statement outside a module at wrapSafe (internal/modules/cjs/loader.js:979:16) at Module._compile (internal/modules/cjs/loader.js:1027:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10) at Module.load (internal/modules/cjs/loader.js:928:32) at Func