SSR on Firebase Hosting with GC Functions not working
Ok so this is my folder Structure
So here is the Functions Index File:
const functions = require('firebase-functions')
const express = require('express')
const Nuxt = require('nuxt')
const app = express()
const config =
dev: false,
buildDir: 'nuxt',
build:
publicPath: '/'
const nuxt = new Nuxt(config)
function handleRequest (req, res)
res.set('Cache-Control', 'public, max-age=600, s-maxage=1200')
nuxt.renderRoute('/').then(result =>
res.send(result.html)
).catch(e =>
res.send(e)
)
app.get('*', handleRequest)
exports.nuxtApp = functions.https.onRequest(app)
But all I get when visiting the Url is ""code":"MODULE_NOT_FOUND"
(after deploying)
All i did in the nuxt.config.js
is just telling it to make the build directory into the nuxt folder in the functions folder
firebase.json
"hosting":
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
"source": "**",
"function": "nuxtApp"
]
When testing locally with Firebase Serve it works but it only renders the base url /
and nothing else and also I have no Static Assets like my scss files or the app manifest.
firebase google-cloud-functions nuxt.js firebase-hosting
add a comment |
Ok so this is my folder Structure
So here is the Functions Index File:
const functions = require('firebase-functions')
const express = require('express')
const Nuxt = require('nuxt')
const app = express()
const config =
dev: false,
buildDir: 'nuxt',
build:
publicPath: '/'
const nuxt = new Nuxt(config)
function handleRequest (req, res)
res.set('Cache-Control', 'public, max-age=600, s-maxage=1200')
nuxt.renderRoute('/').then(result =>
res.send(result.html)
).catch(e =>
res.send(e)
)
app.get('*', handleRequest)
exports.nuxtApp = functions.https.onRequest(app)
But all I get when visiting the Url is ""code":"MODULE_NOT_FOUND"
(after deploying)
All i did in the nuxt.config.js
is just telling it to make the build directory into the nuxt folder in the functions folder
firebase.json
"hosting":
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
"source": "**",
"function": "nuxtApp"
]
When testing locally with Firebase Serve it works but it only renders the base url /
and nothing else and also I have no Static Assets like my scss files or the app manifest.
firebase google-cloud-functions nuxt.js firebase-hosting
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26
add a comment |
Ok so this is my folder Structure
So here is the Functions Index File:
const functions = require('firebase-functions')
const express = require('express')
const Nuxt = require('nuxt')
const app = express()
const config =
dev: false,
buildDir: 'nuxt',
build:
publicPath: '/'
const nuxt = new Nuxt(config)
function handleRequest (req, res)
res.set('Cache-Control', 'public, max-age=600, s-maxage=1200')
nuxt.renderRoute('/').then(result =>
res.send(result.html)
).catch(e =>
res.send(e)
)
app.get('*', handleRequest)
exports.nuxtApp = functions.https.onRequest(app)
But all I get when visiting the Url is ""code":"MODULE_NOT_FOUND"
(after deploying)
All i did in the nuxt.config.js
is just telling it to make the build directory into the nuxt folder in the functions folder
firebase.json
"hosting":
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
"source": "**",
"function": "nuxtApp"
]
When testing locally with Firebase Serve it works but it only renders the base url /
and nothing else and also I have no Static Assets like my scss files or the app manifest.
firebase google-cloud-functions nuxt.js firebase-hosting
Ok so this is my folder Structure
So here is the Functions Index File:
const functions = require('firebase-functions')
const express = require('express')
const Nuxt = require('nuxt')
const app = express()
const config =
dev: false,
buildDir: 'nuxt',
build:
publicPath: '/'
const nuxt = new Nuxt(config)
function handleRequest (req, res)
res.set('Cache-Control', 'public, max-age=600, s-maxage=1200')
nuxt.renderRoute('/').then(result =>
res.send(result.html)
).catch(e =>
res.send(e)
)
app.get('*', handleRequest)
exports.nuxtApp = functions.https.onRequest(app)
But all I get when visiting the Url is ""code":"MODULE_NOT_FOUND"
(after deploying)
All i did in the nuxt.config.js
is just telling it to make the build directory into the nuxt folder in the functions folder
firebase.json
"hosting":
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
"source": "**",
"function": "nuxtApp"
]
When testing locally with Firebase Serve it works but it only renders the base url /
and nothing else and also I have no Static Assets like my scss files or the app manifest.
firebase google-cloud-functions nuxt.js firebase-hosting
firebase google-cloud-functions nuxt.js firebase-hosting
asked Nov 14 '18 at 15:03
BadgyBadgy
1,086320
1,086320
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26
add a comment |
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26
add a comment |
1 Answer
1
active
oldest
votes
After a few days of debugging I found a solution.
At first, you have to extend your error logging, so you can see the stack-trace:
console.error(e)
res.send(e)
My errors were:
error#1 firebase
package was not installed in my functions folder, so I had to install it with npm install --save firebase
in the functions
directory. The overall firebase
package is not required by Cloud Functions, however it's needed for my nuxt
project for firestore
usage
error#2 You could get an error like firebaseApp.firestore is not a function
. It's due to a wrong import of firebase to you could function. I found the solution for this problem here
I change this import:
import firebase from 'firebase';
import 'firebase/firestore';
To this:
import firebase from '@firebase/app';
import '@firebase/firestore'
After solving these two errors, my NuxtJs app worked well with Firebase Cloud Functions.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53303161%2fssr-on-firebase-hosting-with-gc-functions-not-working%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
After a few days of debugging I found a solution.
At first, you have to extend your error logging, so you can see the stack-trace:
console.error(e)
res.send(e)
My errors were:
error#1 firebase
package was not installed in my functions folder, so I had to install it with npm install --save firebase
in the functions
directory. The overall firebase
package is not required by Cloud Functions, however it's needed for my nuxt
project for firestore
usage
error#2 You could get an error like firebaseApp.firestore is not a function
. It's due to a wrong import of firebase to you could function. I found the solution for this problem here
I change this import:
import firebase from 'firebase';
import 'firebase/firestore';
To this:
import firebase from '@firebase/app';
import '@firebase/firestore'
After solving these two errors, my NuxtJs app worked well with Firebase Cloud Functions.
add a comment |
After a few days of debugging I found a solution.
At first, you have to extend your error logging, so you can see the stack-trace:
console.error(e)
res.send(e)
My errors were:
error#1 firebase
package was not installed in my functions folder, so I had to install it with npm install --save firebase
in the functions
directory. The overall firebase
package is not required by Cloud Functions, however it's needed for my nuxt
project for firestore
usage
error#2 You could get an error like firebaseApp.firestore is not a function
. It's due to a wrong import of firebase to you could function. I found the solution for this problem here
I change this import:
import firebase from 'firebase';
import 'firebase/firestore';
To this:
import firebase from '@firebase/app';
import '@firebase/firestore'
After solving these two errors, my NuxtJs app worked well with Firebase Cloud Functions.
add a comment |
After a few days of debugging I found a solution.
At first, you have to extend your error logging, so you can see the stack-trace:
console.error(e)
res.send(e)
My errors were:
error#1 firebase
package was not installed in my functions folder, so I had to install it with npm install --save firebase
in the functions
directory. The overall firebase
package is not required by Cloud Functions, however it's needed for my nuxt
project for firestore
usage
error#2 You could get an error like firebaseApp.firestore is not a function
. It's due to a wrong import of firebase to you could function. I found the solution for this problem here
I change this import:
import firebase from 'firebase';
import 'firebase/firestore';
To this:
import firebase from '@firebase/app';
import '@firebase/firestore'
After solving these two errors, my NuxtJs app worked well with Firebase Cloud Functions.
After a few days of debugging I found a solution.
At first, you have to extend your error logging, so you can see the stack-trace:
console.error(e)
res.send(e)
My errors were:
error#1 firebase
package was not installed in my functions folder, so I had to install it with npm install --save firebase
in the functions
directory. The overall firebase
package is not required by Cloud Functions, however it's needed for my nuxt
project for firestore
usage
error#2 You could get an error like firebaseApp.firestore is not a function
. It's due to a wrong import of firebase to you could function. I found the solution for this problem here
I change this import:
import firebase from 'firebase';
import 'firebase/firestore';
To this:
import firebase from '@firebase/app';
import '@firebase/firestore'
After solving these two errors, my NuxtJs app worked well with Firebase Cloud Functions.
answered Jan 21 at 10:14
Szabó CsabaSzabó Csaba
7316
7316
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53303161%2fssr-on-firebase-hosting-with-gc-functions-not-working%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Just hit the same issue, looks like we both followed youtube.com/watch?v=ZYUWsjUxxUQ&t=896s would be nice if someone has an answer
– JavaBeast
Dec 16 '18 at 0:39
I'm having the same issue with Firebase functions and Nuxtjs.
– Szabó Csaba
Jan 18 at 9:23
@SzaboCsaba Im hosting on Heroku right now since the setup was really messy for the Firebase Hosting + Nuxt also the cold start times of functions made page visits sometimes slow
– Badgy
Jan 18 at 9:26