Grunt plugin for compiling Kit files Can be used to embed files or concatenate files
Install the plugin
npm install grunt-codekit --save-dev
Choose files to compile
The plugin supports compiling templates written using the Kit language of CodeKit™. You can use both short form and long form when specifying input and output destination.
Using short form (see below), the output files will be placed in the
and have the same names as the input files, only using a
.html extension. When using
the long form you can explicitly specify the full name and path of each output file.
There is nothing in the way of mixing and matching the two styles.
As with all Grunt plugins, you can specify an
options object, either for all tasks
or for each task. There is currently just one option:
compilePrefixed- Files starting with an underscore (such as
_header.kit), so called partials, are normally not considered for compilation. By setting this option to true you can override this setting and still compile these files (default
Do remember that Grunt has a lot of fancy ways of doing file system manipulation for you
Example usage: embedding critical path CSS
You still need a way of embedding that CSS, though, and one way of doing that is using the Kit language. An example on how this kit file might look is as follows
<html> <head> <title><!-- @title --></title> <!-- embed critical path css generated by penthouse --> <style> <!--@include critical.css --> </style> </head> <body> <!-- @include _header.kit --> <!-- @include _navbar.kit --> The main text of the page <!-- @include _footer.kit --> </body> </html>
About the Kit language
- 0.1.0 First release. Compilation of Kit files using an embedded python module.
- 0.2.0 Removed dependency on Python.
- 0.3.0 Partials are now being excluded.