Gulp, Pug - 如何将 src/ 目录的子目录中的所有 .pug 文件编译到 /dist 以便它们维护目录层次结构？答案

【问题标题】：Gulp, Pug - How do I compile all .pug files in subdirectories of src/ directory to /dist so they maintain the directory hierarchy?Gulp, Pug - 如何将 src/ 目录的子目录中的所有 .pug 文件编译到 /dist 以便它们维护目录层次结构？
【发布时间】：2018-04-23 20:39:33
【问题描述】：

我的src/ 目录如下：

src/
---about/
------history.pug
------mission.pug
---contact/
------email.pug
---index.pug

我希望我的 .pug 文件以这样的方式编译，即使在 dist/ 目录中它们也能保持此目录层次结构。比如：

dist/
---about/
------history.html
------mission.html
---contact/
------email.html
---index.html

我正在使用 Gulp 来处理 pug 文件。这可以通过使用 gulp 或其他方式的一项任务来实现吗？谢谢！

处理我的 pug 文件的 Gulp 任务：

gulp.task('pug', function() {
    return gulp.src('src/pug/*.pug')
    .pipe(pug({
        basedir: "./"
    }))
    .pipe(gulp.dest('dist/html'));
})

【问题讨论】：

是的，只需一项任务即可轻松实现。你应该展示你的代码。
@Mark 编辑了问题以包括我的 Gulp 任务。我怎样才能将它合并到那里？

标签： html gulp pug

【解决方案1】：

gulp.task('pug', function() {
  return gulp.src('src/**/*.pug')
   .pipe(pug())
   .pipe(gulp.dest('dist'));
})

将获取您的哈巴狗文件并将它们放在我认为您想要的位置。在您的代码中，您有

.pipe(gulp.dest('dist/html'));

但是在您想要的 dist 文件夹结构中没有 html 文件夹。与

相同的评论

gulp.src('src/pug/*.pug')

你的 src 目录没有 pug 子文件夹，为什么 src/pug 在这里？

另外我不认为 {basedir:....} 是 pug 插件的一个选项，所以我删除了它。

【讨论】：

哇，谢谢！这很简单。我在问题中显示的 src 和 dist 目录只是示例，而不是真正的目录。我知道我应该在那里更清楚。哦，还有 basedir 是一种选择。双重检查
很高兴它成功了。如果回答对您有帮助，请采纳。谢谢。