Have opinions about JavaScript? We want to hear them. Take the 2018 JavaScript Ecosystem Survey »

gulp-minify-inline

1.0.0 • Public • Published

gulp-minify-inline NPM version Build Status

gulp-minify-inline is a gulp plugin to uglify inline scripts and minify inline styles. Works best with gulp-minify-html.

This version introduces support for ES6 minification through uglify-es package.

Uses cheerio to parse HTML, harmony branch of UglifyJS2 to uglify JS code and clean-css to minify CSS code.

Please note this is a major version update of the plugin, which includes significantly updated versions of uglify-es (v3.0.21) and clean-css (v4.1.4) npm packages. Options APIs of both packages have changed massively, please update your existing code accordingly, or use previous version of this package (v0.2.1).

Installation

Install package with NPM and add it to your development dependencies:

npm install --save-dev gulp-minify-inline

Usage

Straightforward way:

var minifyInline = require('gulp-minify-inline');
 
gulp.task('minify-inline', function() {
  gulp.src('src/*.html')
    .pipe(minifyInline())
    .pipe(gulp.dest('dist/'))
});

Need a bit more control?

var minifyInline = require('gulp-minify-inline');
 
var options = {
  js: {
    output: {
      comments: true
    }
  },
  jsSelector: 'script[type!="text/x-handlebars-template"]',
  css: {
    level: {1: {specialComments: 0}}
  },
  cssSelector: 'style[data-do-not-minify!="true"]'
};
 
gulp.task('minify-inline', function() {
  gulp.src('src/*.html')
    .pipe(minifyInline(options))
    .pipe(gulp.dest('dist/'))
});

Options

Right now the following options are supported:

  • js contains parameters to pass to UglifyJS2.minify() (for documetation refer to the project homepage). Set it to false to disable JS uglification globally. Please note that the plugin defaults js.output.inline_script to true in order to combat XSS (contributed by @TimothyGu). This is quite useful in general but you might want to re-set it to false explicitly in (an extremely rare) case it breaks things for you.
  • jsSelector passed to cheerio as a selector for script tags. This allows you to avoid uglification of certain script tags (e.g. ones containing templates or other non-JS payload). Default: 'script'.
  • css contains parameters to pass to clean-css (for documetation refer to the project homepage). Set it to false to disable CSS minification globally.
  • cssSelector passed to cheerio as a selector for style tags. This allows you to avoid minification of certain style tags. Default: 'style'.

LICENSE

MIT License

install

npm i gulp-minify-inline

Downloadsweekly downloads

2,657

version

1.0.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability