README

Easily send React Email emails with Laravel using this package.

Installation

First, install the package via Composer:

composer require maantje/react-email

Then, install the required Node dependencies:

npm install vendor/maantje/react-email

Getting Started

Install React Email using the automatic or manual setup.
Create an email component in the emails directory (e.g., new-user.tsx). Ensure the component is the default export.

Example email component:

import * as React from 'react';
import { Text, Html } from '@react-email/components';

export default function Email({ user }) {
    return (
        <Html>
            <Text>Hello, {user.name}</Text>
        </Html>
    );
}

Define the email directory path in your Laravel .env file:

REACT_EMAIL_DIRECTORY="emails/directory/relative/from/laravel/root"

Generate a new Laravel Mailable class:

php artisan make:mail NewUser

Use ReactMailView in your Mailable, or extend your Mailable from `ReactMailable``

use App\Models\User;
use Maantje\ReactEmail\ReactMailable;
use Illuminate\Mail\Mailables\Envelope;
use Illuminate\Mail\Mailables\Content;
use Maantje\ReactEmail\ReactMailView;

class NewUser extends ReactMailable // Extend, from \Maantje\ReactEmail\ReactMailable
{
    use ReactMailView; // or use \Maantje\ReactEmail\ReactMailView
    
    public function __construct(public User $user)
    {
        // Public properties will be passed as props to the React email component.
        // Alternatively, use the `with` property of `content`.
    }
    
    public function envelope()
    {
        return new Envelope(
            subject: 'New User',
        );
    }

    public function content()
    {
        return new Content(
            view: 'new-user', // Component filename without the extension
        );
    }
}

Running Tests

Run tests using Pest:

./vendor/bin/pest

Security

If you discover any security-related issues, please email the author instead of using the issue tracker.

License

This package is open-source and licensed under the MIT License. See the LICENSE file for details.~~

maantje / react-email

Maintainers

Details