0

我有一个包含 3 页的应用程序,我希望它是独立的。为了 DRY 代码,我想对页眉和页脚内容进行“包含”。我查看了grunt-html-build的文档和示例,但不知何故我做不到。所有 HTML 都在 path'src/html'中,includes 位于名为 "includes": 的子文件夹中'src/html/includes'

这是 HTML 示例:

<!doctype html>
<html>
  <head>
  <!-- build:section head --><!-- /build -->
  </head>

  <body>
  <p>A bunch of unique content for each of the pages</p>

  <!-- build:section footer --><!-- /build -->
  </body>
</html>

然后在我的中我有以下内容:

htmlbuild: {
  src: 'src/html/app-*.html',
  dest: 'dist/',
  options: {
    sections: {
      head: 'src/html/includes/head.html',
      footer: 'src/html/includes/footer.html'
    }
  }
}

我确定这只是语法,但我似乎无法克服这个错误:

Warning: an error occurred while processing a template (Unexpected identifier).

它是“意外标识符”这一事实告诉我,我没有正确地打点“i”或跨越“t”。更有经验的眼睛赞赏!

注意:我考虑过使用代替,但如果没有 globbing,我将不得不执行 3 个单独的任务来保持独特内容的完整性。


[编辑添加:]

我使用称为(适当地) grunt-includes的不同 grunt 任务在我的非常基本的用例中取得了成功。我能够适当地包含我的文件。

但是,我仍然对有条件地构建开发或分发包的功能感兴趣。任何见解仍然值得赞赏!

4

1 回答 1

1

htmlbuild是一项多任务,因此您需要在目标下定义文件:

module.exports = function(grunt) {
    grunt.initConfig({
        htmlbuild: {
            dist: {
                src: 'src/html/app-*.html',
                dest: 'dist/',
                options: {
                    sections: {
                        head: 'src/html/includes/head.html',
                        footer: 'src/html/includes/footer.html'
                    }
                }
            }
        }
    });
    grunt.loadNpmTasks('grunt-html-build');
    grunt.registerTask('default', ['htmlbuild']);
};
于 2015-07-04T01:11:46.383 回答