[GH-ISSUE #1081] SSR + Firebase Functions Error 500 #785

Closed
opened 2026-02-27 15:51:49 +03:00 by kerem · 2 comments
Owner

Originally created by @jofftiquez on GitHub (Jun 14, 2022).
Original GitHub issue: https://github.com/quasar/Quasar/issues/1081

Describe the bug
I followed the instructions/examples here: https://quasar.dev/quasar-cli-webpack/developing-ssr/ssr-production-export#example-firebase-function

I uploaded the functions successfully, as we as the corresponding hosting setup. However when I access the deployed app and/or functions I am getting the following error:

ReferenceError: Cannot access 'WEBPACK_DEFAULT_EXPORT' before initialization at Module.default (chunk-837.js:39:42)

I also used "@quasar/app-webpack": "^3.5.3", as the docs mentioned

To Reproduce
Steps to reproduce the behavior:

  1. Add mode ssr
  2. Initialize firebase functions
  3. Point the source path to dist/ssr
  4. Modify the src-ssr/production-export.js file
  5. Upload the the hosting and functions

Expected behavior
The app should work as intended

Screenshots
Screenshot from 2022-06-14 10-34-25
image

System

  • Server OS: ???
  • Client OS: Pop OS
  • Server installed
  • Client installed
  • Quasar Version: ^2.6.0
  • Build configuration: prod

Additional context
production-export.js

import * as functions from 'firebase-functions';
import { ssrProductionExport } from 'quasar/wrappers';

export default ssrProductionExport(({ ssrHandler }) => {
  return {
    hippocradesOrgSSRHandler: functions.https.onRequest(ssrHandler),
  };
});

firbase.json

{
  "functions": {
    "source": "dist/ssr",
    "predeploy": "npm run build"
  },
  "hosting": [
    {
      "target": "prod",
      "public": "dist/ssr",
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "rewrites": [{
        "source": "**",
        "function": "hippocradesOrgSSRHandler"
      }],
      "headers": [
        {
          "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
          "headers": [
            {
              "key": "Access-Control-Allow-Origin",
              "value": "*"
            }
          ]
        },
        {
          "source": "**/*.@(js|css)",
          "headers": [
            {
              "key": "Cache-Control",
              "value": "max-age=604800"
            }
          ]
        },
        {
          "source": "**/*.@(jpg|jpeg|gif|png|mp4|webm)",
          "headers": [
            {
              "key": "Cache-Control",
              "value": "max-age=604800"
            }
          ]
        },
        {
          "source": "404.html",
          "headers": [
            {
              "key": "Cache-Control",
              "value": "max-age=300"
            }
          ]
        }
      ]
    }
  ],
  "emulators": {
    "functions": {
      "port": 7500
    },
    "firestore": {
      "port": 7600
    },
    "hosting": {
      "port": 5000
    },
    "auth": {
      "port": 7700
    },
    "ui": {
      "enabled": true
    },
    "database": {
      "port": 9000
    }
  }
}
Originally created by @jofftiquez on GitHub (Jun 14, 2022). Original GitHub issue: https://github.com/quasar/Quasar/issues/1081 **Describe the bug** I followed the instructions/examples here: https://quasar.dev/quasar-cli-webpack/developing-ssr/ssr-production-export#example-firebase-function I uploaded the functions successfully, as we as the corresponding hosting setup. However when I access the deployed app and/or functions I am getting the following error: > ReferenceError: Cannot access '__WEBPACK_DEFAULT_EXPORT__' before initialization at Module.default (chunk-837.js:39:42) I also used `"@quasar/app-webpack": "^3.5.3",` as the docs mentioned **To Reproduce** Steps to reproduce the behavior: 1. Add mode ssr 2. Initialize firebase functions 3. Point the source path to `dist/ssr` 4. Modify the `src-ssr/production-export.js` file 5. Upload the the hosting and functions **Expected behavior** The app should work as intended **Screenshots** ![Screenshot from 2022-06-14 10-34-25](https://user-images.githubusercontent.com/8638243/173481773-a282fd93-c946-4556-902e-aa7fd4850565.png) ![image](https://user-images.githubusercontent.com/8638243/173481811-a01dfa76-ce65-45db-b910-be50eab8c00f.png) **System** - Server OS: ??? - Client OS: Pop OS - Server installed - Client installed - Quasar Version: `^2.6.0` - Build configuration: `prod` **Additional context** **production-export.js** ```js import * as functions from 'firebase-functions'; import { ssrProductionExport } from 'quasar/wrappers'; export default ssrProductionExport(({ ssrHandler }) => { return { hippocradesOrgSSRHandler: functions.https.onRequest(ssrHandler), }; }); ``` **firbase.json** ```json { "functions": { "source": "dist/ssr", "predeploy": "npm run build" }, "hosting": [ { "target": "prod", "public": "dist/ssr", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ], "rewrites": [{ "source": "**", "function": "hippocradesOrgSSRHandler" }], "headers": [ { "source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)", "headers": [ { "key": "Access-Control-Allow-Origin", "value": "*" } ] }, { "source": "**/*.@(js|css)", "headers": [ { "key": "Cache-Control", "value": "max-age=604800" } ] }, { "source": "**/*.@(jpg|jpeg|gif|png|mp4|webm)", "headers": [ { "key": "Cache-Control", "value": "max-age=604800" } ] }, { "source": "404.html", "headers": [ { "key": "Cache-Control", "value": "max-age=300" } ] } ] } ], "emulators": { "functions": { "port": 7500 }, "firestore": { "port": 7600 }, "hosting": { "port": 5000 }, "auth": { "port": 7700 }, "ui": { "enabled": true }, "database": { "port": 9000 } } } ```
kerem closed this issue 2026-02-27 15:51:50 +03:00
Author
Owner

@jofftiquez commented on GitHub (Jun 14, 2022):

It seems this is not a problem with Quasar, I managed to make it work with a fresh simple project. Apparently it has to do with the imports within the app as discussed here. I still haven't figured out what's wrong with my work but I will update it here. Thanks.

<!-- gh-comment-id:1154673670 --> @jofftiquez commented on GitHub (Jun 14, 2022): It seems this is not a problem with Quasar, I managed to make it work with a fresh simple project. Apparently it has to do with the imports within the app as discussed [here](https://stackoverflow.com/questions/65038253/uncaught-referenceerror-cannot-access-webpack-default-export-before-initi). I still haven't figured out what's wrong with my work but I will update it here. Thanks.
Author
Owner

@jofftiquez commented on GitHub (Jun 14, 2022):

OMG this is the wrong quasar. HAHAHAHA. My bad, I was supposed to open an issue to quasar framework. 😅

<!-- gh-comment-id:1154674641 --> @jofftiquez commented on GitHub (Jun 14, 2022): OMG this is the wrong quasar. HAHAHAHA. My bad, I was supposed to open an issue to quasar framework. 😅
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/Quasar#785
No description provided.