I am trying to use styles.css in handlebars with nodemailer. After importing styles.css its throwing error getaddrinfo ENOTFOUND styles.css
, Without linking the css handlebar is working completely fine.
Folder Structure:
├── public/
│ └── account-creation/
│ ├── styles.css
│ └── account-creation.hbs
In my account-creation handlebar :
<link rel='stylesheet' href='styles.css' />
MailerModule.ts
@Module({
imports: [
MailerModule.forRootAsync({
imports: [ConfigModule],
inject: [ConfigService],
useFactory: async (configService: ConfigService) => ({
transport: {
host: configService.get('MAIL_HOST'),
port: configService.get('MAIL_PORT'),
secure: configService.get('MAIL_SECURE'),
auth: {
user: configService.get('MAIL_USER'),
pass: configService.get('MAIL_PASS'),
},
},
template: {
dir: join(__dirname, '../../public'),
adapter: new HandlebarsAdapter(),
options: {
strict: true,
},
},
}),
}),
],
exports: [MailerModule],
})
export class EmailModule {}
Account-creation method
async accountCreation(name: string, email: string): Promise<void> {
await this.mailerService.sendMail({
to: email,
subject: 'Account Creation on LocalHost',
template: './account-creation/account-creation',
context: {
name,
},
});
console.log(`sending mail to ${name} ${email}`);
}
Email client support for loading of CSS from a <link>
is patchy, so you should probably avoid it altogether.
Among clients that do support it, they won't be able to resolve the path styles.css
(they are reading the email from their mailbox, not your server's filesystem). You'd need to either replace that with an HTTP(S) URL or attach the file to the email and use a cid:
or mid:
scheme URL.
(And if you are thinking about going down the attachment route, you might as well just inline the stylesheet.)