I am trying to build a live styleguide for an existing project. As part of this I would like to include all the shtml widgets I have in one folder into a single html file.
The type of solution I am looking for would follow this kind of behaviour:
The project is running with both grunt and SSIs through an express server, so there are a couple of options I guess.
I have found this package which does grunt includes, however much of this is above my level of knowledge, so I have failed to get anything to work.
This is the code I have so far for my grunt file:
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 %> -->'
}
}
}
I can see how this might work with a single, named file, but to loop through a folder seems a much harder task.
Any suggestions for a possible solution are gladly welcome.
In the end I used the suggestion from Qualcuno to use grunt-html-build. This works very well, I will potentially write another grunt task to write in the titles for the widgets on the page.
This was my final code:
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'
}
}
}
}