feat(workflow): update packages, make nvm obsolete

Author: s-be

.nvmrc

@@ -1,23 +1,29 @@
-module.exports = function(grunt) {
+(function() {
+  const path = require('path'),
+    folders = {
+      app: 'app',
+      dist: 'dist',
+      tmp: '.tmp'
+    };
 
-  require('load-grunt-config')(grunt, {
+  module.exports = function(grunt) {
+    var path = require('path');
 
-    // Pass data to tasks
-    data: {
-
-      // Re-usable filesystem path variables
-      paths: {
-        src:        'src',
-        src_img:    'src/img',
-        dist:       'dist',
-        dist_img:   'dist/img',
-        preview:    'preview'
-      },
-
-      // secrets.json is ignored in git because it contains sensitive data
-      // See the README for configuration settings
-      secrets: grunt.file.readJSON('secrets.json')
-
-    }
-  });
-};
+    require('load-grunt-config')(grunt, {
+      configPath: [
+        path.join(process.cwd(), 'grunt'),
+      ],
+      init: true,
+      data: {
+        folders: folders,
+        paths: {
+          src:        'src',
+          src_img:    'src/img',
+          dist:       'dist',
+          dist_img:   'dist/img',
+          preview:    'preview'
+        },
+      }
+    });
+  };
+})();

Gruntfile.js

@@ -0,0 +1,116 @@
+# Grunt Email Design Workflow
+based on [github.com/leemunroe](https://github.com/leemunroe/grunt-email-workflow)
+
+## Changelog 
+
+### v0.2.0 - 09/01/2024
+
+* update packages and dependencies for current node versions: nvm not needed
+* disable third-party connections (see [GDPR](https://en.wikipedia.org/wiki/General_Data_Protection_Regulation))
+
+## Purpose
+
+Designing and testing emails is a pain. HTML tables, inline CSS, various devices and clients to test, and varying support for the latest web standards.
+
+This Grunt task helps simplify things.
+
+1. Compiles your SCSS to CSS
+2. Builds your HTML email templates
+3. Inlines your CSS
+
+## Requirements
+
+You may already have these installed on your system. If not, you'll have to install them.
+
+* Node.js - [Install Node.js](https://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager)
+* Grunt-cli and Grunt (`npm install grunt-cli -g`)
+* (optional) [Litmus](https://litmus.com) - Tests the email across all clients/browsers/devices
+
+## Getting started
+
+If you haven't used [Grunt](http://gruntjs.com/) before check out Chris Coyier's post on [getting started with Grunt](http://24ways.org/2013/grunt-is-not-weird-and-hard/).
+
+#### 1. Setup
+
+Clone this repo, cd to the directory, run `npm install` to install the necessary packages.
+
+```sh
+cd grunt-email-workflow
+npm install
+```
+
+#### 2. Run Grunt
+
+Run `grunt build` and check out your `/dist` folder to see your compiled and inlined email templates.
+
+Run `grunt serve`, a new live-reload browser tab will open. Happy coding :)
+
+## How it works
+
+### CSS
+
+This project uses [SCSS](http://sass-lang.com/). You don't need to touch the .css files, these are compiled automatically.
+
+For changes to CSS, modify the `.scss` files.
+
+Media queries and responsive styles are in a separate style sheet so that they don't get inlined. Note that only a few clients support media queries e.g. iOS Mail app.
+
+### Email templates and content
+
+Handlebars and Assemble are used for templating.
+
+`/layouts` contains the standard header/footer HTML wrapper markup. You most likely will only need one layout template, but you can have as many as you like.
+
+`/emails` is where your email content will go. To start you off I've included example transactional emails based on my [simple HTML email template](https://github.com/leemunroe/html-email-template).
+
+`/data` contains _optional_ .yml or .json data files that can be used in your templates. It's a good way to store commonly used strings and variables. See `/data/default.yml` and `/partials/follow_lee.hbs` for an example.
+
+`/partials` contains _optional_ .hbs files that can be thought of like includes. To use a partial, for example `/partials/follow_lee.hbs` you would use the following code in your emails template:
+
+```hbs
+{{> follow_lee }}
+```
+
+`/partials/components` contains _optional_ .hbs files that can help generate your markup. Each component will typically have a corresponding Sass file in `src/css/sass/<component_name>.scss`. To use a component, for example `/partials/components/button.hbs` you would use the following code in your emails template. _(note: You can use single -or- double quotes for attributes)_
+
+```hbs
+{{> button type="primary" align="center" url="LINK GOES HERE" title="ANCHOR TEXT GOES HERE" }}
+```
+
+### Generate your email templates
+
+In terminal, run `grunt build`. This will:
+
+* Compile your SCSS to CSS
+* Generate your email layout and content
+* Inline your CSS
+
+See the output HTML in the `dist` folder. Open them and preview it the browser.
+
+Alternatively run `grunt serve`. This will check for any changes you make to your .scss and .hbs templates, automatically run the tasks, and serve you a preview in the browser on http://localhost:4000. Saves you having to run grunt every time you make a change.
+
+### Browser-based previews
+
+In terminal, run `grunt serve`.
+
+* This will run the default tasks `grunt` + the `watch` task will be initiated
+* A preview UI will automagically open on [http://localhost:4000](http://localhost:4000) and you can review your templates
+* Go about your business editing templates and see your template changes live-reload
+* __NOTE:__ The express server stops working when the `watch` task is not running
+
+
+### Sample email templates
+
+I've added a few templates here to help you get started.
+
+* [Simple transactional email template](http://leemunroe.github.io/grunt-email-workflow/dist/transaction.html)
+* [Branded email via CDN](http://leemunroe.github.io/grunt-email-workflow/dist/branded.html)
+* [Email with components](http://leemunroe.github.io/grunt-email-workflow/dist/components.html)
+
+### More resources
+
+* For more transactional email templates check out [HTML Email templates](https://htmlemail.io)
+* [Things I've learned about sending email](http://www.leemunroe.com/sending-email-designers-developers/)
+* [Things I've learned about building email templates](http://www.leemunroe.com/building-html-email/)
+* [Things I've learned about responsive email](https://www.leemunroe.com/responsive-email-design/)
+* Prefer Gulp? Daryll Doyle has created a [Gulp email creator](https://github.com/darylldoyle/Gulp-Email-Creator)

license.txt LICENSE

@@ -1,38 +1,16 @@
-# Where we tell Grunt what to do when we type "grunt" into the terminal
-# $ grunt
 default:
-  - 'clean'
-  - 'sass:dist'
-  - 'assemble'
-  - 'juice'
-  - 'imagemin'
-  - 'replace:src_images'
+  - serve
 
-# Use grunt send if you want to actually send the email to your inbox
-# $ grunt send --template=transaction.html
-send:
-  - 'mailgun'
+build:
+  - clean
+  - sass:dist
+  - assemble
+  - juice
 
-# Upload images to your CDN on Rackspace Cloud Files
-# $ grunt rsupload
-rsupload:
-  - 'default'
-  - 'cloudfiles'
-  - 'cdn:cloudfiles'
-
-# Upload image files to Amazon S3
-# $ grunt s3upload
-s3upload:
-  - 'default'
-  - 'aws_s3:prod'
-  - 'cdn:aws_s3'
-
-# Launch the express server and start watching
-# $ grunt serve
 serve:
-  - 'default'
-  - 'sass:preview'
-  - 'autoprefixer:preview'
-  - 'express'
-  - 'open'
-  - 'watch'
+  - build
+  - sass:preview
+  - autoprefixer:preview
+  - express:server
+  - open
+  - watch

README.md

@@ -1,12 +1,16 @@
-// Browser-based preview task
 module.exports = {
   server: {
     options: {
+      cmd: process.argv[0],
+      background: true,
+      delay: 1000,
+      output: '.+',
       port: 4000,
-      hostname: '127.0.0.1',
+      script: './server.js',
+      debug: true,
       bases: ['<%= paths.dist %>', '<%= paths.preview %>', '<%= paths.src %>'],
-      server: './server.js',
-      livereload: true
+      livereload: true,
+      spawn: false,
     }
   }
-}
+};

grunt/aliases.yaml

@@ -1,6 +1,6 @@
 // Inlines your CSS
 module.exports = {
-  your_target: {
+  dist: {
     options: {
       preserveMediaQueries: true,
       applyAttributesTableElements: true,

grunt/express.js

@@ -2,7 +2,10 @@
 module.exports = {
   emails: {
     files: ['<%= paths.src %>/css/scss/*/**','<%= paths.src %>/emails/*','<%= paths.src %>/layouts/*','<%= paths.src %>/partials/**/*','<%= paths.src %>/data/*'],
-    tasks: ['default']
+    tasks: ['build'],
+    options: {
+      livereload: true
+    }
   },
   preview_dist: {
     files: ['./dist/*'],