[SOLVED] Using Firebase and Nuxt3 server routes error: "i.consume is not a function"?

Using Firebase and Nuxt3 server routes error: "i.consume is not a function"?

I am trying to test out using Firebase with Nuxt3 server routes and for some reason get the following error:

[nitro] [dev] [unhandledRejection] TypeError: i.consume is not a function

I Googled and nothing came up, nor nothing here in stackoverflow question archive.

Anyone got any ideas what is causing the problem?

All I am trying to do is get all the posts from my firestore database like so using Nuxt3's server routes:

server/api/posts/all.ts:

import { firestore } from '@/server/utils/firebase';

export default defineEventHandler(async (event) => {
  const colRef = firestore.collection('posts').orderBy('createdAt', 'desc');
  const querySnapshot = await colRef.get();
  const posts = [];
  querySnapshot.forEach((doc) => {
    posts.push(doc.data());
  });
  return {
    posts,
  };
});

Then, I call it in app.vue:

<template>
  <div>
    {{ data }}
  </div>
</template>

<script setup>
const { data } = await useFetch(`/api/posts/all`);

</script>

Nothing is shown on the UI except for a console error. Anyone got any ideas?

I have a minimal reproduction link here that shows the error: https://stackblitz.com/edit/nuxt-starter-j4ueey?file=app.vue

Solution

At the end, the issue is not happening locally only on Codesandbox.
So it's basically a non-issue!

Was probably something regarding the sandboxed environment itself.