node package manager


grunt-htmlgen Build Status

Grunt (0.4.x) task to generate HTML files with stylesheet and script elements.


htmlgen is a multi task so any targets, files and options should be specified according to the multi task documentation.

Brief configuration guide:

  1. Add grunt-htmlgen in devDependency in package.json.
  2. Run npm install in your project's directory to install the dependencies.
  3. Edit Gruntfile.js to use this task:
    1. Add grunt.loadNpmTasks('grunt-htmlgen');
    2. Add htmlgen: { // Your configuration } in grunt.initConfig



Type: String

Location of the generated HTML file.

options (optional)

charset (optional)

Type: String

Character set of the page (will be used in meta element). Default value is utf-8

title (optional)

Type: String

Title of the page to generate.

css (optional)

Type: String|Array

URL or array of URLs of stylesheets to include.

js (optional)

Type: String|Array

URL or array of URLs of scripts to include.

body (optional)

Type: String

Body HTML to include in the page.



module.exports = function(grunt) {
  'use strict';

    meta: {
      sample: {
        css_reset: 'styles/reset.css',
        js_index: 'scripts/index.js'
    htmlgen: {
      sample: {
        dest: 'tmp/sample.html',
        options: {
          title: 'Title',
          css: [
            '<%= meta.sample.css_reset %>',
          js: [
            '<%= meta.sample.js_index %>'

  grunt.registerTask('default', ['htmlgen']);


Content of tmp/sample.html after run grunt or grunt:sample

<!doctype html>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="styles/reset.css">
<link rel="stylesheet" type="text/css" href="styles/style1.css">
<link rel="stylesheet" type="text/css" href="styles/style2.css">
<script src="scripts/script1.js"></script>
<script src="scripts/script2.js"></script>
<script src="scripts/index.js"></script>

Release history

  • 2013-02-18    v0.1.2    Add charset and body options
  • 2013-02-18    v0.1.1    Update development dependencies for Grunt 0.4.0
  • 2013-02-14    v0.1.0    Change the configuration by moving title, css, js options into the options.
  • 2013-02-14    v0.0.1    First release.