Nuxt compiler bug in production #168
Description
After deploying my project on Vercel, I often encounter this error. Each time, I end up having to redeploy the project to fix it. I was wondering if you might have any insights on what could be causing this issue.
Here is all piece of code related:
resendService.ts
import { useCompiler } from '#vue-email';
import { Resend } from "resend";
const resend = new Resend(process.env.NUXT_PRIVATE_RESEND_API_KEY);
export async function sendOtp(email: string, otp: string) {
const runtimeConfig = useRuntimeConfig();
const siteUrl = runtimeConfig.public.siteUrl;
const template = await useCompiler('verify-otp.vue', {
props: {
otp,
redirectUrl: `${siteUrl}/login?email=${email}&otp=${otp}`,
}
});
try {
await resend.emails.send({
from: "HugoRCD <[email protected]>",
to: [email],
subject: "Welcome to Shelve!",
html: template.html,
});
} catch (error) {
console.error(error);
}
}./emails/verify-otp.vue
<script setup lang="ts">
defineProps({
otp: {
type: String,
required: true
},
redirectUrl: {
type: String,
required: true
}
});
</script>
<template>
<ETailwind>
<EHtml>
<EHead />
<EPreview>
Here is your code to access Shelve
</EPreview>
<EBody class="m-auto bg-white font-sans">
<EContainer class="mx-auto my-[40px] max-w-[465px] rounded border border-solid border-[#eaeaea] p-[20px] md:p-7">
<EHeading class="mb-4 text-center text-2xl font-bold text-[#000000] md:text-3xl">
Welcome to Shelve
</EHeading>
<EText class="mb-4 text-center text-[#000000]">
Your OTP is:
</EText>
<EText class="mb-4 text-center text-[36px] font-bold text-[#000000]">
<span class="text-[#2C3BF5]">{{ otp }}</span>
</EText>
<EText class="mb-4 text-center text-[#000000]">
Use this OTP to verify your account
</EText>
<ESection class="my-[32px] text-center">
<EButton px="20" py="12" class="rounded bg-[#000000] text-center text-[12px] font-semibold text-white no-underline" :href="redirectUrl">
Go to Shelve
</EButton>
</ESection>
<EText class="text-[14px] leading-[24px] text-black">
or copy and paste this URL into your browser:
<ELink :href="redirectUrl" class="text-[#2C3BF5]">
{{ redirectUrl }}
</ELink>
</EText>
<EHr class="mx-0 my-[26px] w-full border border-solid border-[#eaeaea]" />
<EText class="text-[12px] leading-[24px] text-[#666666]">
If you were not expecting this invitation, you can ignore this email. If you are concerned about your account's safety, please reply to this email to get in touch
with us.
</EText>
</EContainer>
</EBody>
</EHtml>
</ETailwind>
</template>
<style scoped>
</style>