Vue Email

npm install @vue-email/components

export default defineNuxtConfig({
    build: {
        transpile: ['@vue/email'],
    },
    nitro: {
        esbuild: {
            options: {
                target: 'esnext',
            },
        },
    },
});

<script setup lang="ts">

defineProps<{
    name: string;
}>();
</script>

<template>
    <VueEmail>
        <Html>
            <Head />
            <Preview>Welcome to Vue Email</Preview>
            <Container>
                <h1>Welcome, {{ name }}!</h1>
                <p>Thanks for trying Vue Email. We're thrilled to have you on board.</p>
            </Container>
        </Html>
    </VueEmail>
</template>

export const testWorkflow = workflow('test-workflow', async ({ step, payload }) => {
    await step.email('send-email', async (controls) => {
        return {
            subject: controls.subject,
            body: renderEmail(payload.userName),
        };
    },
    {
        controlSchema: z.object({
            subject: z.string().default('A Successful Test on Novu from {{userName}}'),
        }),
    });
}, {
    payloadSchema: z.object({
        userName: z.string().default('John Doe'),
    }),
});