I'm trying to deploy Nuxt.js (2)
SSR app to Firebase Hosting/Functions
. I'm able to do that, as long as I won't include nuxt.config.ts
in functions/src/index.ts
. However, I do have some setup there, such as meta tags, I'd like to push.
That's my nuxt.config.js
file (basically default Firebase
starter for .ts
+ nuxt
imports):
const { Nuxt } = require('nuxt-start')
const functions = require('firebase-functions')
const nuxtConfig = require('./../nuxt.config.ts')
const config = {
...nuxtConfig,
dev: false,
debug: false,
}
const nuxt = new Nuxt(config)
exports.ssrapp = functions.https.onRequest(async (req: any, res: any) => {
await nuxt.ready()
nuxt.render(req, res)
})
Using both module.exports = { ... }
and export default { ... }
inside nuxt.config.ts
returns:
Error: Failed to load function definition from source: Failed to generate manifest from function source: SyntaxError: Cannot use import statement outside a module
then I add "type": "module"
to functions/package.json
(changing package.json
in root
won't help) and that's what I can see:
Error: Failed to load function definition from source: Failed to generate manifest from function source: ReferenceError: require is not defined in ES module scope, you can use import instead
This file is being treated as an ES module because it has a '.js' file extension and 'path/to/my/project/functions/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
I try to change from export default
to module.exports = { ... }
inside nuxt.config.ts
and it gives me the same error Error: Failed to load function definition from source: Failed to generate manifest from function source:...
I've tried to change to import * as nuxtConfig from './../nuxt.config'
while keeping module.exports = { ... }
inside nuxt.config.ts
, but success either, code is generated the same, and it creates src
folder inside functions/lib
complicating further the structure of Firebase
project.
Changing back to export default { ... }
inside nuxt.config.ts
and keeping import * as nuxtConfig from './../nuxt.config'
returns again:
Error: Failed to load function definition from source: Failed to generate manifest from function source: ReferenceError: require is not defined in ES module scope, you can use import instead
This file is being treated as an ES module because it has a '.js' file extension and 'path/to/my/project/Doyban-Website/functions/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
Lastly, I've tried to use all import
's inside functions/index.ts
import * as functions from 'firebase-functions'
// @ts-ignore
import Nuxt from 'nuxt-start'
import * as nuxtConfig from './../nuxt.config'
const config = {
...nuxtConfig,
dev: false,
debug: false,
}
const nuxt = new Nuxt(config)
exports.ssrapp = functions.https.onRequest(async (req: any, res: any) => {
await nuxt.ready()
nuxt.render(req, res)
})
the result:
Error: Failed to load function definition from source: Failed to generate manifest from function source: ReferenceError: require is not defined in ES module scope, you can use import instead
This file is being treated as an ES module because it has a '.js' file extension and 'path/to/my/project/Doyban-Website/functions/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
I have no idea :-(