Mailer SMTP Configuration

SkillCommunication

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

Use Mailer SMTP Configuration in Claude, ChatGPT or Ahel Desktop

Free. Sign in, add Mailer SMTP Configuration and connect your AI. About a minute.

Also: Claude Code · Cursor · Codex

Then ask your AI: use the Mailer SMTP Configuration skill

Details

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

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

Mailer SMTP ConfigurationStart free
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