使用 SSI 或 grunt 将所有 shtml 文件编译成一个 html 文件

Question

我正在尝试为现有项目构建实时样式指南。作为其中的一部分，我想将一个文件夹中的所有 shtml 小部件包含到一个 html 文件中。

我正在寻找的解决方案类型将遵循这种行为：

搜索小部件文件夹中的所有文件
将所有文件编译成一个 html 页面
使用文件名作为每个包含的小部件上方的标题

该项目是运行通过 express 服务器的 grunt 和 SSI，所以我猜有几个选项。

我找到了这个包含 grunt 的包，但是其中大部分超出了我的知识水平，所以我没有得到任何工作。

这是目前我的 grunt 文件的代码：

includes: {
  files: {
    src: ['widgets/.shtml'], // Source files
    dest: 'kitchen-sink', // Destination directory
    flatten: true,
    cwd: '.',
    options: {
      silent: true,
      banner: '<!-- I am a banner <% includes.files.dest %> -->'
    }
  }
}

我知道这可能如何处理单个命名文件，但循环遍历文件夹似乎是一项更艰巨的任务。

欢迎提出任何可能的解决方案建议。

Answer 1

最后我根据Qualcuno的建议使用了grunt-html-build。这非常有效，我可能会编写另一个 grunt 任务来为页面上的小部件编写标题。

这是我的最终代码：

htmlbuild: {
            dist: {
            src: 'kitchen_sink/kitchen-sink.shtml',
            dest: 'prod/kitchen_sink/kitchen-sink.shtml',
            options: {
                sections: {
                    views: 'prod/templates/widgets/**/*.shtml',
                    templates: 'prod/templates/widgets/**/*.shtml'
                }
            }
        }
        }

使用 SSI 或 grunt 将所有 shtml 文件编译成一个 html 文件

Compiling all shtml files into one html file using SSI or grunt

html

javascript

ssi

node.js

gruntjs