Mailer SMTP Configuration

SkillCommunication

Helps your agent configure email sending in a Webiny project by setting up SMTP settings correctly.

Available today. Use it from your connected AI after setup.

Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.

Then ask your AI: use the Mailer SMTP Configuration skill

About this skill

Use when configuring SMTP email/mailer settings in a Webiny project. Triggers on: "configure email", "set up SMTP", "mailer config", "sending emails", "email not working", "configure mailer", "SMTP password", "Api.Mailer.Smtp".

What this skill tells your AI

The instructions your AI receives, as published by webiny/webiny-js in skills/user-skills/mailer-smtp/SKILL.md and read by ahel’s review.

TL;DR

Add <Api.Mailer.Smtp ... /> to your webiny.config.tsx to configure SMTP email delivery at build time. The component serializes the settings into the build artifact — always pass the password via an environment variable, never hard-code it. Deploy the API after making changes.

Core Pattern

import { Api } from "webiny/extensions";

<Api.Mailer.Smtp
    host={"smtp.example.com"}
    port={587}
    user={"smtp-user"}
    password={process.env.SMTP_PASSWORD!}
    from={"noreply@example.com"}
    replyTo={"support@example.com"}   {/* optional */}
/>

Place this inside the JSX returned by your config component in webiny.config.tsx, alongside other <Api.*> extensions.

Props Reference

PropTypeRequiredDescription
hoststringYesSMTP server hostname
portnumberYesSMTP server port (positive integer)
userstringYesSMTP authentication username
passwordstringYesSMTP authentication password — use env var
fromstringYesDefault sender address
replyTostringNoDefault reply-to address

from and replyTo are validated by the email-addresses package against RFC 5322.

Full Example (webiny.config.tsx)

import React from "react";
import { Api, Admin, Core } from "webiny/extensions";

const MyConfig = () => {
  return (
    <>
      {/* ... other extensions ... */}

      {/* Mailer: configure SMTP transport via code */}
      <Api.Mailer.Smtp
        host={"smtp.sendgrid.net"}
        port={587}
        user={"apikey"}
        password={process.env.SENDGRID_API_KEY!}
        from={"noreply@acme.com"}
        replyTo={"support@acme.com"}
      />
    </>
  );
};

Add SENDGRID_API_KEY=your-secret to your .env file (never commit it).

Common Mistakes

MistakeFix
Hard-coding the passwordUse process.env.SMTP_PASSWORD!
process.env.SMTP_PASSWORD undefined at build time → "expected string, received object" errorEnsure the env var is set before deploying
from/replyTo value fails validationMust be a valid RFC 5322 mailbox address
Settings not taking effectRun yarn webiny build api after editing webiny.config.tsx

Quick Reference

# After editing webiny.config.tsx, build the API
yarn webiny build api

Note: This command only works in a dev environment. For other environments, run yarn webiny build api --env=YOUR_ENV instead.

// Environment variable in .env
SMTP_PASSWORD = your - smtp - password - here;

Related Skills

  • webiny-project-structure — Where webiny.config.tsx lives and how extensions are structured
  • webiny-local-development — Running and deploying locally

Signals

GitHub stars
8k
Forks
679
Last commit
Sep 2026
Advanced
Item type
skill
Key
webiny-mailer-smtp
Source
github.com/webiny/webiny-js