Can't resolve dns and child_process when using Nodemailer and Webpack

Question

I'm trying to send a simple email using nodemailer, but am getting the following issues. It seems like the issue is with webpack. I've included the error and the code in question. Thanks!

Console log:

ERROR in ./~/nodemailer/lib/mailer/index.js
Module not found: Error: Can't resolve 'dns' in 
'/Users//Users/user/Projects/world-domination/project-folder/node_modules/nodemailer/lib/mailer'
@ ./~/nodemailer/lib/mailer/index.js 14:12-26
@ ./~/nodemailer/lib/nodemailer.js
@ ./src/app/components/contact/contact.component.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

ERROR in ./~/nodemailer/lib/sendmail-transport/index.js
Module not found: Error: Can't resolve 'child_process' in 
'/Users/user/Projects/world-domination/project-folder/node_modules/nodemailer/lib/sendmail-transport'
@ ./~/nodemailer/lib/sendmail-transport/index.js 3:14-38
@ ./~/nodemailer/lib/nodemailer.js
@ ./src/app/components/contact/contact.component.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

Code in question:

import { Component, OnInit } from '@angular/core';
import * as nodemailer from 'nodemailer';

@Component({
  selector: 'app-contact',
  templateUrl: './contact.component.html',
  styleUrls: ['./contact.component.scss']
})
export class ContactComponent implements OnInit {
    public sendMessage(): void {
        let transporter = nodemailer.createTransport({
          host: 'smtp.example.com',
          port: 465,
          secure: true,
          auth: {
            user: '[email protected]',
            pass: 'samplePassword'
         }
    });

    let mailOptions = {
        from: '"Mr. Sender" <[email protected]>',
        to: '[email protected]',
        subject: 'Test email subject',
        text: 'Test email body'
    };

    transporter.sendMail(mailOptions, (error, info) => {
      if (error) {
        return console.log(error);
      }
      console.log('Message %s sent: %s', info.messageId, info.response);
    })
  }
}

Answer 1

You simply can't have nodemailer in the frontend. Nodemailer and other projects depending on it (i.e. gmail-send) are made for nodejs use in the backend.

Instead, you should look into either using a 3rd party smtp service like AWS-SES or make your own by using nodemailer in the backend and the front end would invoke it through something like https requests.

Answer 2

@Abdullah Adeeb was correct. I ended up just using AWS-SES and calling it from the front end.

Component code for fix:

/// <reference types="aws-sdk" />
import { Component } from '@angular/core';
import * as aws from 'aws-sdk';
import { SES } from 'aws-sdk'
import { AwsConfig } from '../../../awsConfig';

@Component({
  selector: 'app-contact',
  templateUrl: './contact.component.html',
  styleUrls: ['./contact.component.scss']
})
export class ContactComponent {

  private _ses: SES;

  constructor() {
    this.configureSES();
  }

  public sendMessage(): void {
    let params;
      params = {
        Destination: {
          ToAddresses: [ '[email protected]' ]
        },
        Message: {
          Body: {
            Html: {
              Charset: 'UTF-8',
              Data: '<h1>HTML needed inside of your email</h1>'
            },
            Text: {
              Charset: 'UTF-8',
              Data: 'Or you can use plain text'
            }
          },
          Subject: {
            Charset: 'UTF-8',
            Data: 'Sample message subject'
          }
        },
        Source: '[email protected]' // Must be registered with AWS
      };
      this.sendEmail(params);
    }
  }

  private configureSES(): void {
    aws.config.credentials = {
      accessKeyId: AwsConfig.accessKeyId,
      secretAccessKey: AwsConfig.secretAccessKey
    };
    aws.config.update({
      region: AwsConfig.region
    });
    this._ses = new SES({
      apiVersion: '2010-12-01'
    });
  }

  private sendEmail(params): void {
    this._ses.sendEmail(params, function(err, data) {
      if (err) {
        console.log(err, err.stack);
      } else {
        console.log(data);
      }
    });
  }
}