The DefaultEmailPlugin configures the the EmailOptions to use an MJML-based email generator and presents a simplified interface for typical email requirements.
const config: VendureConfig = {
// Add an instance of the plugin to the plugins array
plugins: [
new DefaultEmailPlugin({
templatePath: path.join(__dirname, 'vendure/email/templates'),
transport: {
type: 'smtp',
host: 'smtp.example.com',
port: 587,
auth: {
user: 'username',
pass: 'password',
}
},
}),
],
};
Emails are generated from templates which use MJML syntax. MJML is an open-source HTML-like markup language which makes the task of creating responsive email markup simple. By default, the templates are installed to <project root>/vendure/email/templates and can be freely edited.
Dynamic data such as the recipient's name or order items are specified using Handlebars syntax:
<p>Dear {{ order.customer.firstName }} {{ order.customer.lastName }},</p>
<p>Thank you for your order!</p>
<mj-table cellpadding="6px">
{{#each order.lines }}
<tr class="order-row">
<td>{{ quantity }} x {{ productVariant.name }}</td>
<td>{{ productVariant.quantity }}</td>
<td>{{ formatMoney totalPrice }}</td>
</tr>
{{/each}}
</mj-table>
The following helper functions are available for use in email templates:
formatMoney: Formats an amount of money (which are always stored as integers in Vendure) as a decimal, e.g. 123 => 1.23formatDate: Formats a Date value with the dateformat package.For development, the transport option can be replaced by devMode: true. Doing so configures Vendure to use the file transport and outputs emails as rendered HTML files in a directory named "test-emails" which is located adjacent to the directory configured in the templatePath.
new DefaultEmailPlugin({
templatePath: path.join(__dirname, 'vendure/email/templates'),
devMode: true,
})