gulp-html-sugar

Extendable html syntax sugar Gulp plugin.

Install

Install with npm

npm install gulp-html-sugar --save-dev

Example

gulpfile.js

const htmlSugar = require('gulp-html-sugar');
return gulp.src('src/example.html').pipe(htmlSugar({
    'icon': function ($, element) {
        const iconName = element.html().trim();
        element.replaceWith($(`<svg class="icon ${iconName}"><use xlink:href="sprite.svg#${iconName}"></use></svg>`));
     }
})).pipe(gulp.dest('build/'));

example.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Example page</title>
  </head>
  <body>
    <icon>trash</icon>
  </body>
</html>

Result:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Example page</title>
  </head>
  <body>
    <svg class="icon trash"><use xlink:href="sprite.svg#trash"></use></svg>
  </body>
</html>

API

htmlSugar(options)

options.[selector]

Type: function(document, element)

document and element is cheerio objects.

gulp-html-sugar

Install

Example

gulpfile.js

example.html

Result:

API

htmlSugar(options)

options.[selector]

License