CLI Commands

The CLI tool includes commands for scaffolding, developing, and building your emails.

Development

CLI commands for developing HTML emails with Maizzle.

serve

maizzle serve

Use this command to develop emails locally:

• a local development server is first created with BrowserSync
• maizzle build is then called to compile your templates
• a directory listing is finally opened in your default browser (configurable)

You can make changes to a file, save it, and the browser will automatically reload to reflect changes. And, of course, you can also configure BrowserSync.

This command has the fastest build time, since most Transformers are disabled on purpose for local development, in the base config.js.

When developing locally, you have all classes generated by Tailwind CSS at your disposal, so you can rapidly prototype and style emails, right in the browser.

build

maizzle build [env]

maizzle build is used to compile your templates and output them to the destination directory. If [env] is specified, Maizzle will try to compute an environment config by merging config.[env].js on top of the default config.

Scaffolding

CLI commands for creating new projects and scaffolding templates or configs.

new

maizzle new

The new command is used to scaffold and initialize a Maizzle project.

Run it with no arguments and you are presented with an interactive prompt:

Alternatively, you can add those arguments manually.

maizzle new <starter> [path] --no-deps?

As you can see, the arguments are similar to those in the git clone command.

The --no-deps flag can be used to skip installing NPM dependencies:

So you can basically clone any repo into any system path, which means you can use any starter project - not just ours - as long as you can clone it with Git.

Use one of the original starters:

maizzle new amp4email

Create from any GitHub repo:

maizzle new user/repo

Create from any Git repo:

maizzle new https://example.com/some-repo.git

Use a custom folder name:

maizzle new maizzle/starter-litmus folder-name

make:config

maizzle make:config [env] --full?

Scaffolds a new config.[env].js in the project root.

Simply running maizzle make:config will bring up an interactive prompt:

Of course, you can skip the prompt by passing in arguments:

maizzle make:config [env] --full?

The [env] argument is an environment name, i.e. staging.

For example, let's scaffold config.staging.js:

maizzle make:config staging

By default, a minimal config is output, which only defines build.destination.path:

module.exports = {
  build: {
    destination: {
      path: 'build_staging',
    },
  },
}

If you want a full config, use the --full option:

maizzle make:config staging --full

make:layout

maizzle make:layout

Scaffolds a new Layout based on the Starter's default Layout.

Running it with no arguments will present an interactive prompt:

You can skip the prompt by passing in arguments:

Examples:

# scaffold a Layout in src/layouts
maizzle make:layout my-layout.html

# use a custom directory
maizzle make:layout amp-layout.html --directory=src/layouts/amp

# the above is the same as
maizzle make:layout amp-layout.html -d=src/layouts/amp

# paths can be relative to project root, i.e. one level above
maizzle make:layout master.html -d=../global-layouts

make:template

maizzle make:template

Scaffolds a new Template.

Running it with no arguments will present an interactive prompt:

You can skip the prompt by passing in arguments:

Examples:

# scaffold a Template in src/templates
maizzle make:template my-template.html

# use a custom directory
maizzle make:template amp-template.html --directory=src/templates/amp

# the above is the same as
maizzle make:template amp-layout.html -d=src/layouts/amp

# paths can be relative to project root, i.e. one level above
maizzle make:template example.html -d=../parent-directory