gulp - gulp 合并流只添加一个

Question

我有一个 gulp 方法，可以成功地从一个 html 文件中获取内容并注入到指定的 src 文件中，然后输出到一个目录。

我现在处于需要将两个不同文件中的 html 注入到一个文件中的位置，例如 FormMaster.html 应该有从 FormChildOne.html 和 FormChildTwo.html 注入的代码。

我尝试过使用合并流、事件流和流队列，但我得到的最远的是当前状态：

async function forms() {
    var injectOptions = {
        starttag: '<!-- inject:lastesthtml -->',
        endtag: '<!-- endinject -->',
        transform: function (filePath, file) {
            return file.contents.toString('utf8')
        }
    };

    var stream1;
    var stream2;

    stream1 = src(`${origin}/Example/TestForm/FormMaster.html`)
        .pipe(flatmap(function (stream, file) {
            var html = src(
                path.join(`${origin}`, '/Example/TestForm/FormChildOne.html')
                    .split('.')[0] + '.html'
            );
            return stream
                .pipe(inject(
                    html.pipe(htmlmin({
                        removeEmptyAttributes: true,
                        collapseBooleanAttributes: true,
                        collapseWhitespace: true,
                        minifyJS: true,
                        minifyCSS: true,
                    }))
                    .pipe(replace(
                      //some replace code here
                    ))
                , injectOptions
                ))
                .pipe(htmlmin({
                    removeEmptyAttributes: true,
                    collapseBooleanAttributes: true,
                    collapseWhitespace: true,
                    minifyJS: true,
                    minifyCSS: true,
                }))
                .pipe(rename(function (path) {
                    path.extname = ".complete.html";
                }))
                .pipe(dest(
                    `${destination}/html/Test1`
                ));
        }));

流 2 类似于流 1，只是引用的文件不同：

        var html = src(
            path.join(`${origin}`, '/Example/TestForm/FormChildTwo.html')
                .split('.')[0] + '.html'
        );

而且目的地不同。

stream1 目的地是${destination}/html/Test1

stream2 目的地是${destination}/html/Test2

在stream2之后：

return merge(stream1, stream2)
.pipe(dest(
    `${destination}/html/Test3`
));

我在 test1 和 test2 的输出文件中看到了我想要的更改，但显然它们没有合并到一个文件中，它们是两个文件。如果我只是使每个流的目的地相同，我只会得到一个流的结果。

我希望流合并能解决这个问题，但我仍然只看到合并目标中的两个流更改之一。我不知道这是为什么或如何解决它。

标签： gulp