Gulp file for MJML & Statamic email templates

gulpfile.js

const gulp = require('gulp');
const {series} = require('gulp');
const mjml = require('gulp-mjml');
const browserSync = require('browser-sync');

const mjmlEngine = require('mjml');
const fs = require('fs');
require('dotenv').config();

const server = browserSync.create();


// const clean = () => del(['dist']);

const basePaths = {
	src: './email/mjml/',
	plainTextSrc: './email/plaintext/',
	dest: './email/dist/',
};

const paths = {
	html: {
		src: `${basePaths.src}index.mjml`,
		dest: `${basePaths.dest}`,
	},
	htmlDE: {
		src: `${basePaths.src}index-de.mjml`,
		dest: `${basePaths.dest}`,
	},
	includes: {
		src: `${basePaths.src}/*.mjml`,
	},
};


function html() {
	return gulp.src(paths.html.src)
		.pipe(mjml(mjmlEngine, {minify: true}))
		.pipe(gulp.dest(paths.html.dest));
}

function htmlDe() {
	return gulp.src(paths.htmlDE.src)
		.pipe(mjml(mjmlEngine, {minify: true}))
		.pipe(gulp.dest(paths.htmlDE.dest));
}

function reload(done) {
	server.reload();
	done();
}

function serve(done) {
	server.init({
		server: {
			baseDir: './email/dist/'
		}
	});
	done();
}

function deployTemplates(cb) {
	const mailTemplateEN = fs.readFileSync('email/dist/index.html', 'utf8');
	const mailTemplateDE = fs.readFileSync('email/dist/index-de.html', 'utf8');

	let progress = 0;
	const onProgress = () => {
		progress++;

		if (progress === 2) {
			cb();
		}
	};

	const orderPlainText = fs.readFileSync('email/plaintext/order.txt', 'utf8');
	const orderTemplate = fs.readFileSync('htdocs/site/themes/theme/templates/email/order.html', 'utf8');

	fs.writeFileSync('htdocs/site/themes/theme/templates/email/order.html', `${orderPlainText}\n\n---\n\n${mailTemplateEN}`);
	cb();
}

const watch = () => {
	gulp.watch(basePaths.src, gulp.series(html, reload));
};

const dev = gulp.series(html, serve, watch);
exports.default = dev;
exports.export = series(html, htmlDe);
exports.build = series(exports.export, deployTemplates);