如何在Gulp

Question

我试图在Gulp中创建一个

的构建系统

1. 在每个文件夹中记录HTML文件
2. 使用其他HTML
包装HTML文件
3. 创建名为wrapped.html
的新文件
4. 将该文件放在该文件夹中。

要换行，我正在使用gulp-wrapper并尝试重命名该文件，我使用gulp-rename

预期结果：

page1 / page.html ：

<h1>This is page 1 content</h1>

在这样的文件夹结构中：

page1/
    page.html
page2/
    page.html

运行Gulp任务将变为

page1/
    page.html
    wrapped.html
page2/
    page.html
    wrapped.html

page1 / wrapped.html 现在看起来像：

<header></header>
<h1>This is page 1 content</h1>
<footer></footer>

目前，我的代码是

gulp.task('layout', function() {
    return gulp.src('src/**/page.html', { base: "./" })
    .pipe(wrapper({
       header: '<header></header',
       footer: '<footer></footer>'
    }))
    .pipe(rename("test.html"))
    .pipe(gulp.dest('.'));
});

但是，这只会将文件放在/文件夹中，而不是放在源文件夹中的文件。

如果我这样做：

gulp.task('layout', function() {
    return gulp.src('src/**/page.html', { base: "./" })
    .pipe(wrapper({
       header: '<header></header',
       footer: '<footer></footer>'
    }))
    .pipe(gulp.dest('.'));
});

这会将它放在源自它的文件夹中，但只是覆盖现有文件。

我不确定如何达到我的验收标准。任何帮助表示赞赏。感谢。

Answer 1

您需要使用basename的{​​{1}}选项。来自docs：

  

gulp-rename是没有扩展名的文件名

这将有效：

basename