Email Sending in Voussoir
Send emails via various transports, rendered with Express-compatible renderers.
Powered by keystone-email.
Transports
See keystone-email for supported
transports and options.
Renderers
Express-compatible renderers should work out of the box
(as long as they export an __express key)
React / jsx
There is a jsx renderer powered by express-react-views.
Usage:
index.js
const emailSender = require('@voussoir/email');
const jsxEmailSender = emailSender.jsx({
// The directory containing the email templates
root: `${__dirname}/emails`,
// The transport to send the emails (see `keystone-email` docs)
transport: 'mailgun'
});
await jsxEmailSender('new-user.jsx').send(
{ ... }, // renderer props
{ ... }, // transport options (api keys, to/from, etc). See `keystone-email` docs
);emails/new-user.jsx
const React = require('react');
module.exports = class extends React.Component {
render() {
return (
<html>
<body>
<div>Hello {this.props.name}</div>
</body>
</html>
);
}
};NOTE: The jsx renderer has a peer dependency on react & react-dom.
mjml
There is support for mjml-react
using the mjml renderer.
Usage:
index.js
const emailSender = require('@voussoir/email');
const mjmlEmailSender = emailSender.mjml({
// The directory containing the email templates
root: `${__dirname}/emails`,
// The transport to send the emails (see `keystone-email` docs)
transport: 'mailgun'
});
// NOTE: The `.jsx` extension is still used here
await mjmlEmailSender('new-user.jsx').send(
{ ... }, // renderer props
{ ... }, // transport options (api keys, to/from, etc). See `keystone-email` docs
);emails/new-user.jsx
const React = require('react');
const { Mjml, MjmlBody, MjmlSection, MjmlColumn, MjmlText } = require('mjml-react');
module.exports = class extends React.Component {
render() {
return (
<Mjml>
<MjmlBody width={500}>
<MjmlSection fullWidth backgroundColor="#efefef">
<MjmlColumn>
<MjmlText>Hello!</MjmlText>
</MjmlColumn>
</MjmlSection>
</MjmlBody>
</Mjml>
);
}
};NOTE: The mjml renderer has a peer dependency on react, react-dom, & mjml-react.
Jade
Usage:
const emailSender = require('@voussoir/email');
const jadeEmailSender = emailSender.jade({
// The directory containing the email templates
root: `${__dirname}/emails`,
// The transport to send the emails (see `keystone-email` docs)
transport: 'mailgun'
});
await jadeEmailSender('new-user.jade').send(
{ ... }, // renderer props
{ ... }, // transport options (api keys, to/from, etc). See `keystone-email` docs
);Other renderers
Above are examples of using 2 renderers, jsx, and jade.
In general, renderers are available directly on the exported object:
const emailSender = require('@voussoir/email');
emailSender.<renderer>(...);While you're able to access any renderer this way, not every package will work.
Under the hood, keystone-email will call require(<renderer>), then use the
__express export. ie; any compatible express renderer should work as long as
it's in your dependencies.
See keystone-email for more.