Nuxt3 `Maximum call stack size exceeded` on **vercel**, but works perfectly fine locally

J

Jonas•7/14/24, 5:28 PM

message.txt2.88KB

J

Jonas•7/14/24, 5:29 PM

/login

/login

/login

/login:

<script setup lang="ts">
definePageMeta({
  name: "Login",
  alias: ['/sign-in', '/login']
})
</script>

<template>
  <div class="fixed transform -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2">
    <LogIn />
  </div>
</template>

<style scoped></style>

<script setup lang="ts">
definePageMeta({
  name: "Login",
  alias: ['/sign-in', '/login']
})
</script>

<template>
  <div class="fixed transform -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2">
    <LogIn />
  </div>
</template>

<style scoped></style>

<script setup lang="ts">
definePageMeta({
  name: "Login",
  alias: ['/sign-in', '/login']
})
</script>

<template>
  <div class="fixed transform -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2">
    <LogIn />
  </div>
</template>

<style scoped></style>

<script setup lang="ts">
definePageMeta({
  name: "Login",
  alias: ['/sign-in', '/login']
})
</script>

<template>
  <div class="fixed transform -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2">
    <LogIn />
  </div>
</template>

<style scoped></style>

J

Jonas•7/14/24, 5:30 PM

user.ts (bad name tbf):

import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', () => {
    const signIn = async (email: string, password: string) => {
        return await $fetch('/api/auth/login', { method: 'POST', body: { email, password } });
    }

    const signUp = async (email: string, password: string) => {
        return await $fetch('/api/auth/sign-up', { method: 'POST', body: { email, password } });
    }

    const signOut = async () => {
        return await $fetch('/api/auth/logout', { method: 'POST' });
    }

    return {
        signIn,
        signUp,
        signOut
    };
})

import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', () => {
    const signIn = async (email: string, password: string) => {
        return await $fetch('/api/auth/login', { method: 'POST', body: { email, password } });
    }

    const signUp = async (email: string, password: string) => {
        return await $fetch('/api/auth/sign-up', { method: 'POST', body: { email, password } });
    }

    const signOut = async () => {
        return await $fetch('/api/auth/logout', { method: 'POST' });
    }

    return {
        signIn,
        signUp,
        signOut
    };
})

import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', () => {
    const signIn = async (email: string, password: string) => {
        return await $fetch('/api/auth/login', { method: 'POST', body: { email, password } });
    }

    const signUp = async (email: string, password: string) => {
        return await $fetch('/api/auth/sign-up', { method: 'POST', body: { email, password } });
    }

    const signOut = async () => {
        return await $fetch('/api/auth/logout', { method: 'POST' });
    }

    return {
        signIn,
        signUp,
        signOut
    };
})

import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', () => {
    const signIn = async (email: string, password: string) => {
        return await $fetch('/api/auth/login', { method: 'POST', body: { email, password } });
    }

    const signUp = async (email: string, password: string) => {
        return await $fetch('/api/auth/sign-up', { method: 'POST', body: { email, password } });
    }

    const signOut = async () => {
        return await $fetch('/api/auth/logout', { method: 'POST' });
    }

    return {
        signIn,
        signUp,
        signOut
    };
})

J

Jonas•7/14/24, 5:32 PM

What is weird, is that sign-up loads fine now, but log-in doesn't

J

Jonas•7/14/24, 5:33 PM

also what is happening here?
This is so confusing. Why does it work in dev?

JJonas also what is happening here? This is so confusing. Why does it work in dev?

J

Jonas•7/14/24, 5:38 PM

okay, i get this one. neondb doesn't seem to support basic postgres functions

JJonas What is weird, is that sign-up loads fine now, but log-in doesn't

J

Jonas•7/14/24, 5:40 PM

I have no clue why that is tho

J

Jonas•7/14/24, 6:12 PM

https://nuxai-chat.vercel.app/sign-up works.
https://nuxai-chat.vercel.app/log-in doesn't.
They basically have the same code

J

Jonas•7/14/24, 6:14 PM

only the html is different...

JJonas also what is happening here? This is so confusing. Why does it work in dev?

J

Jonas•7/14/24, 7:39 PM

I get the same error when

CREATE EXTENSION pgcrypto;

CREATE EXTENSION pgcrypto;

CREATE EXTENSION pgcrypto;

CREATE EXTENSION pgcrypto; is enabled

C

Cue•7/14/24, 10:33 PM

One thing that pops out to me is renaming

<LogIn />

<LogIn />

<LogIn />

<LogIn /> to

<Login />

<Login />

<Login />

<Login /> in your

log-in.vue

log-in.vue

log-in.vue

log-in.vue page? Since Login.vue component exists but LogIn.vue does not.

@Jonas may I also advise caution despite having deleted your most recent comment. Such an attitude will turn heads and that’s not doing you any favours. Someone at some point will offer some help. There’s a lot to digest in the information you’ve given, a little patience goes a long way. Thanks.

J

Jonas•7/14/24, 11:09 PM

Thank you, that is weird. It is called LogIn.vue locally but Login.vue is on github. I assume I renamed it in the past.

J

Jonas•7/14/24, 11:09 PM

Windows back again...

J

Jonas•7/14/24, 11:10 PM

oh wow

J

Jonas•7/14/24, 11:10 PM

I need case sensitivity on windows

CCue One thing that pops out to me is renaming `<LogIn />` to `<Login />` in your `lo...

J

Jonas•7/14/24, 11:11 PM

I was frustrated, because I asked 4 questions and nobody responded anything after days. Thanks a lot for the reply.

J

Jonas•7/14/24, 11:19 PM

It worked. Thank you so much!

Nuxt3 `Maximum call stack size exceeded` on vercel, but works perfectly fine locally

Similar Threads

Similar Threads

Similar Threads