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:
- Add grunt-htmlgen in
devDependencyinpackage.json. - Run
npm installin your project's directory to install the dependencies. - Edit
Gruntfile.jsto use this task:- Add
grunt.loadNpmTasks('grunt-htmlgen'); - Add
htmlgen: { // Your configuration }ingrunt.initConfig
- Add
Type: String
Location of the generated HTML file.
Type: String
Character set of the page (will be used in meta element). Default value is utf-8
Type: String
Title of the page to generate.
Type: String|Array
URL or array of URLs of stylesheets to include.
Type: String|Array
URL or array of URLs of scripts to include.
Type: String
Body HTML to include in the page.
module.exports = function(grunt) {
'use strict';
grunt.initConfig({
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 %>',
'styles/style1.css',
'styles/style2.css'
],
js: [
'scripts/script1.js',
'scripts/script2.js',
'<%= meta.sample.js_index %>'
],
}
}
}
});
grunt.loadNpmTasks('grunt-htmlgen');
grunt.registerTask('default', ['htmlgen']);
};
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Title</title>
<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">
</head>
<body>
<script src="scripts/script1.js"></script>
<script src="scripts/script2.js"></script>
<script src="scripts/index.js"></script>
</body>
</html>
- 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.