如何连接插件'html-minifier？

Question

以下代码无效。我正在尝试连接 'html-minifier' plugin to 'gulp' via the 'vinyl-source-stream' 插件。

我为什么要这样做？我在 this page 上看到您可以连接插件 'browserify'。我写了这段代码，但它给出了一个错误。我该如何解决？

'use strict';
const { src, dest, series } = require('gulp')
const htmlMinify = require('html-minifier').minify;
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');

const options = {
    includeAutoGeneratedTags: true,
    removeAttributeQuotes: true,
    removeComments: true,
    removeRedundantAttributes: true,
    removeScriptTypeAttributes: true,
    removeStyleLinkTypeAttributes: true,
    sortClassName: true,
    useShortDoctype: true
};
const result = htmlMinify('frontend/*.html', options)

function test() {
    return result.bundle()
        .pipe(source('frontend/**/*.html'))
        .pipe(buffer())
        .pipe(dest('public'))
}

exports.build = series(test)

Answer 1

我写了下面的代码，现在'html-minifier'插件可以直接在'gulp'中运行了。
const options 变量是 'html-minifier' 插件设置。
然后我们创建一个 函数 gHtmlMinify 可以运行与 gulp gHtmlMinify 命令。
return src(...) 是您的 html 文件路径。
.on('data', function(file) {...} 每个线程都有一个“数据”事件..
我们挂起“数据”事件的处理..
当“data”事件被调用时，“file”对象就来找我们了，它包含的信息有：文件名、文件路径、工作目录和文件内容。
文件的内容表示为读取缓冲区 file.isBuffer().
Buffer.from 原始数据存储在 Buffer class.
的实例中 (file.contents.toString() 这个文件内容是BUFFER.
toString() 方法 return 是一个表示对象的函数。转换为字符串。

console.log ({ // 输出文件的结构。
contents: file.contents, // 文件内容 BUFFER.缓冲区不是字符串！
path: file.path, // 文件路径。
cwd: file.cwd, // 当前目录。 “gulp 命令所在的目录是运行”。
base: file.base, // 星号前的值，即 app/
relative: file.relative, // 星号后的值，即 filename.html
dirname: file.dirname, // 文件目录。
basename: file.basename, // 文件名。
stem: file.stem, // 不带扩展名的文件名。
extname: file.extname // 文件扩展名。
})

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)

如何连接插件'html-minifier？

How to connect plugin 'html-minifier?

node.js

gulp

html-minifier