@hbertoson/astro-mailer
v1.0.1
Published
Astro Mailer Integration
Maintainers
hbertosonReadme
Astro Mailer
Astro Mailer is an Astro integration that enables you to send email notifications via any SMTP service using Nodemailer. This is perfect for handling form submissions, alerts, or transactional messages in your Astro project.
Features
- Send email notifications from your Astro site using SMTP.
- Capture form data and pass it into customizable email templates.
- Supports custom headers such as
X-Entity-Ref-IDandList-Unsubscribe. - Compatible with Astro’s server-side routing and form handling.
- Flexible SMTP configuration for any provider (e.g., Gmail, SendGrid, Mailgun, etc).
Prerequisites
You’ll need access to any SMTP server. For example:
- Gmail
- SendGrid
- Amazon SES
- Mailgun
- SMTP2GO
- Postmark
- Mailjet
- Zoho Mail
- Office 365
- Any other SMTP service
Installation
Install via the Astro CLI:
pnpm astro add @hbertoson/astro-mailernpm astro add @hbertoson/astro-maileryarn astro add @hbertoson/astro-mailerOr manually:
- Install dependencies:
pnpm add @hbertoson/astro-mailer- Add it to your Astro config:
import mailer from '@hbertoson/astro-mailer';
export default defineConfig({
integrations: [
mailer({
smtp: {
host: 'smtp.example.com',
},
templates: {
welcome: './src/components/emails/WelcomeEmail.astro',
},
}),
],
});.env Setup
[email protected]
SMTP_PASS=yourpassword
[email protected]Configuration Options
| Option | Type | Required | Description |
| ------------------ | --------- | -------- | --------------------------------- |
| fromEmail | string | ✅ | Sender email address |
| smtp | object | ✅ | SMTP configuration for Nodemailer |
| templates | object | ✅ | Named Astro components for emails |
| preventThreading | boolean | ❌ | Prevent Gmail threading |
| unsubscribeUrl | string | ❌ | Add List-Unsubscribe header |
| verbose | boolean | ❌ | Enable debug logging |
Usage Example
<body>
<h1>Astro Mailer</h1>
<button>Send Email</button>
<script>
const button = document.querySelector('button') as HTMLButtonElement;
button.addEventListener('click', async () => {
const emailData: BaseEmailRequest = {
to: '[email protected]',
subject: 'Test Email',
templateName: 'email',
props: {
name: 'Hunter',
content: 'This is a test email. From my Astro Mailer Integration',
},
};
const res = await fetch('api/email', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(emailData),
});
if (res.ok) {
const data = await res.json();
console.log('Email sent successfully:', data);
} else {
console.error('Error sending email:', res.statusText);
}
});
</script>
</body>Roadmap
- [ ] Add CC and BCC support
- [ ] Async form binding example
- [ ] File attachments
- [ ] Email queues with retry
- [ ] SMTP transport pool option
Contributing
This repo is structured as a monorepo:
playground: example Astro project to test the integrationpackage: source code of the integration
Start developing:
pnpm i --frozen-lockfile
pnpm devAcknowledgements
