gulp-minify-inline is a gulp plugin that minifies inline JS and CSS. Works best with gulp-minify-html.
Uses cheerio to parse HTML, terser to minify JS and clean-css to minify CSS.
Installation
Install package with NPM and add it to your development dependencies:
npm install --save-dev gulp-minify-inline
Usage
Straightforward way:
var minifyInline = ; gulp;
Need a bit more control?
var minifyInline = ; 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;
Options
Right now the following options are supported:
js
contains parameters to pass toterser.minify()
(for documetation refer to the project homepage). Set it tofalse
to disable JS minification globally. Please note that the plugin defaultsjs.output.inline_script
totrue
in order to combat XSS (contributed by @TimothyGu). This is quite useful in general but you might want to re-set it tofalse
explicitly in (an extremely rare) case it breaks things for you.jsSelector
is passed to cheerio as a selector for script tags. This allows you to avoid minification 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 tofalse
to disable CSS minification globally.cssSelector
is passed to cheerio as a selector for style tags. This allows you to avoid minification of certain style tags. Default:'style'
.