Skip to content Skip to sidebar Skip to footer

How To Connect Plugin 'html-minifier?

The following code does not work. I am trying to connect the 'html-minifier' plugin to 'gulp' via the 'vinyl-source-stream' plugin. Why am I doing this? I read on this page that yo

Solution 1:

I wrote the following code and now the 'html-minifier' plugin can work directly in 'gulp'.
The const options variable is the 'html-minifier' plugin settings.
Then we create a function gHtmlMinify that can be run with the gulp gHtmlMinify command.
return src(...) is your html files path.
.on('data', function(file) {...} Each thread has a "data" event..
We hang the processing of the "data" event..
When the "data" event is called, the "file" object comes to us, which contains information: file name, file path, working directory and file contents.
The content of the file is represented as a read buffer file.isBuffer().
Buffer.from The raw data is stored in instances of the Buffer class.
(file.contents.toString() This file content is BUFFER.
The toString() method returns a function that represents an object. Converts to a string.

console.log ({ // Outputting the structure of what the file consists of.
contents: file.contents, // Content of the file BUFFER. The buffer is not a string!
path: file.path, // Path to the file.
cwd: file.cwd, // Current directory. "The directory where the gulp command was run".
base: file.base, // Value before asterisks i.e. app/
relative: file.relative, // Value after the asterisks i.e. filename.html
dirname: file.dirname, // File directory.
basename: file.basename, // File name.
stem: file.stem, // File name without extension.
extname: file.extname // File extension.
})

const { src, dest, series } = require('gulp');
const htmlMinify = require('html-minifier');

const options = {
    includeAutoGeneratedTags: true,
    removeAttributeQuotes: true,
    removeComments: true,
    removeRedundantAttributes: true,
    removeScriptTypeAttributes: true,
    removeStyleLinkTypeAttributes: true,
    sortClassName: true,
    useShortDoctype: true,
    collapseWhitespace: true
};

function gHtmlMinify() {
    return src('app/**/*.html')
        .on('data', function(file) {
            const buferFile = Buffer.from(htmlMinify.minify(file.contents.toString(), options))
            file.contents = buferFile;
            console.log(file);
            return;
        })
        .pipe(dest('build'))
}


exports.gHtmlMinify = series(gHtmlMinify)

Post a Comment for "How To Connect Plugin 'html-minifier?"