使用 gulp 将多个haml文件编译成一个html答案

【问题标题】：Compiling multiple haml files into one html with gulp使用 gulp 将多个haml文件编译成一个html
【发布时间】：2017-03-22 06:22:28
【问题描述】：

我已经让 gulp 正确地编译和缩小我的 scss 和 js 文件，但是在我的一生中，我似乎无法使用 gulp-haml 模块正确编译 haml 文件。

我的 gulpfile.js 中的相应代码如下所示：

gulp.task('haml', function() {
 gulp.src('.app/**/*.haml')
  .pipe(plumber())
  .pipe(haml())
  .pipe(gulp.dest('./hamltest'));
});

gulp.task('scripts', [
  'styles', 
  'app',
  'haml'
]);

gulp.task('watch', function() {
 gulp.watch([
    './styles/',
    '.app/**/*.js',
    '.app/**/*.haml'
],
[
    'styles',
    'app',
    'haml'
 ]);
});

gulp.task('default', [
 'styles', 
 'scripts',
 'haml', 
 'watch'
]);

我已经设置了我所有的 gulp 变量并且我正在运行：

gulp-haml -v 0.1.6
haml -v 0.4.3
gulp CLI -v 1.2.2
本地 -v 3.9.1

在终端中使用命令：$ gulp 运行所有内容

此时我想知道是否可以将多个haml 文件编译成一个html 或将多个haml 文件编译成一个主haml 文件然后渲染成html。

使用haml partials 是一种更好的方法吗？使用 Gulp 可以实现这一切吗？任何见解将不胜感激。

附加信息：我也尝试过使用管道 order() 和管道 concat() 函数

【问题讨论】：

标签： html gulp haml

【解决方案1】：

使用 gulp-haml 无法编译像这样的 Ruby 代码：

= Haml::Engine.new(File.read('./includes/menu-main.haml')).render

因为 gulp-haml 没有完整的 Ruby 引擎功能。如果您想使用 Ruby，请下载并安装，然后为它安装 haml（但 Ruby 请求非常慢~1-3s）。或者，使用其他一些模板，如 gulp-file-include，这样您就可以编译然后包含已编译的 .HTML 文件（我使用 gulp-jhaml，它与 gulp-haml 具有相同的功能）：

var haml        = require('gulp-jhaml'),
    gih         = require('gulp-include-html'),
    browserSync = require('browser-sync');

gulp.task('haml', function() {
  return gulp.src(['source-folder/*.haml'])
    .pipe(haml({}, {eval: false}))
    .on('error', function(err) {
      console.error(err.stack) 
    })
    .pipe(gulp.dest('source-folder/html'));
});
gulp.task('html-include', ['haml'], function () {  
  gulp.src(['source-folder/html/*.html'])
    .pipe(gih({
      prefix: '@@'
    }))
    .pipe(gulp.dest('result-folder'));
});
gulp.task('watch', ['html-include', 'browser-sync'], function() {
  gulp.watch('source-folder/*.haml', ['html-include']);
  gulp.watch('result-folder/*.html', browserSync.reload);
});
gulp.task('default', ['watch']);

您也可以尝试gulp-pug 与本机函数包含。 Pug - 之前被称为“翡翠”。

【讨论】：