A Metalsmith plugin to clean HTML markup
Last updated 2 years ago by pierresenechal .
MIT · Original npm · Tarball · package.json
$ cnpm install metalsmith-clean-html 
SYNC missed versions from official npm registry.


A Metalsmith plugin to clean HTML markup

CircleCI Codecov NPM Latest Master

This plugin clean the markup of the HTML files. This is useful to make up for the various templating engines that do not always output nice, readable, code. It uses prettier under the hood.

Getting started

  1. Install this plugin (see Installing)
  2. Add it to your Metalsmith build file or configuration
  3. (optional) Use the clean property in your source files to opt-out (default is clean: true)
  4. (optional) Use the encoding property in your source files to specificy their encoding (default is encoding: utf-8)

Example source files


title: My Website

Hello, World!

Example layout files


<!DOCTYPE html>
<html><head><title>{{ title }}</title></head><body><header><h1>{{ title }}</h1></header><main><p>{{ contents | safe }}</p></main><footer><hr />Licensed under CC-BY-SA</footer></body></html>

Example output without clean-html


<!DOCTYPE html>
<html><head><title>My Website</title></head><body><header><h1>My Website</h1></header><main><p>Hello, World!</p></main><footer><hr />Licensed under CC-BY-SA</footer></body></html>

Example output with clean-html


<!DOCTYPE html>
      <title>My Website</title>
      <h1>My Website</h1>
      <p>Hello, World!</p>
      <hr />
      Licensed under CC-BY-SA


With npm installed, run

$ npm install metalsmith-clean-html

For static websites, some prefer to specificy --save-dev to npm install as the distributed website does not actually require this plugin as a dependency.


Since Metalsmith follows a Pipeline pattern, the step at which plugins run is important. This plugin should ideally run after the layout step.

There is only one option:

name default description
filter **/*.html glob pattern that file name should match, otherwise it will be skipped

Example build file with options

// ...
    .use(cleanHtml({ filter: "*.html" }))
    .build(function (err) {
        if (err) throw err;

Example configuration with options

  "source": "src",
  "destination": "build",
  "plugins": [{
    "metalsmith-markdown": {},
    "metalsmith-layouts": {},
    "metalsmith-clean-html": {
      "filter": "*.html"


If you'd like to contribute, please fork the repository and use a feature branch. Issues and pull requests are warmly welcome.

Links and references



This software is free software licensed under the MIT License. See LICENSE.MD

Current Tags

  • 1.0.3                                ...           latest (2 years ago)

4 Versions

  • 1.0.3                                ...           2 years ago
  • 1.0.2                                ...           2 years ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
Maintainers (1)
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (4)
Dev Dependencies (6)
Dependents (0)

Copyright 2014 - 2017 © |