grunt-wooha-html v2.0.3
grunt-wooha-html
self fed dev craft with bower,grunt,require HTML build plugin.
this plugin is used for version control,html compress,js\css inject.
Update log
- Version 2.0.2 add module.exports support with browserify
Getting Started
This plugin requires Grunt ~0.4.5
npm install grunt-wooha-html --save-dev
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
grunt.loadNpmTasks('grunt-wooha-html');
The "wooha_html" task
Overview
In your project's Gruntfile, add a section named wooha_html
to the data object passed into grunt.initConfig()
.
grunt.initConfig({
wooha_html: {
options: {
}
}
});
inject script or stylesheet
If you want inject some js or css file in html, You just need add a "inject" attribute on script tag of html.
<script src="***" inject></script>
<link rel="stylesheet" type="text/css" href="***" inject>
Options Quick Reference
Option | Description | Default |
---|---|---|
exportMode | is this project use 1:module.exports or 2:CMD or 3:react | 1 |
env | which environment build for | 'pro' |
build | grunt build folder | 'build' |
version | version code | '' with out version control |
main | page main js file | index.js |
beautify | beautify html file | false |
minify | html-minifier options.The minify option is useless when option beautify is true.More information seehtml-minifier | object |
Usage
CommonJS mode
wooha_html: {
dist: {
cwd: './demo/',
src: ['**/*.html', '!**/*.jst.html'],
dest: './html/',
options: {
version: '<%= version %>',
env: '<%= env %>',
build: "<%= buildBase %>",
src: "<%= srcBase %>",
main: "index",
exportMode: 2,
minify: {
preserveLineBreaks: true,
minifyCSS: true,
minifyJS: true,
maxLineLength: 1024
},
beautify: false
}
}
}
Browserify module.exports mode
wooha_html: {
dist: {
cwd: './demo/',
src: ['**/*.html', '!**/*.jst.html'],
dest: './html/',
options: {
exportMode: 1,
version: '<%= version %>',
minify: {
preserveLineBreaks: true,
minifyCSS: true,
minifyJS: true,
maxLineLength: 1024
},
processContent: function (html) {
/*
* 统计代码注入
* */
return html;
}
}
}
}
React web mode
wooha_html: {
dist: {
cwd: './demo/',
src: ['**/*.html', '!**/*.jst.html', "!ueditor/**/*.html"],
dest: './html/',
options: {
version: '<%= version %>',
exportMode: 3,
minify: {
preserveLineBreaks: true,
minifyCSS: true,
minifyJS: true,
maxLineLength: 1024
},
beautify: true,
processContent: function (html) {
/*
* 统计代码注入
* */
return html;
}
}
}
}
Project orga
- root
- build -- build code folder
- html -- built html folder
- demo -- dev html folder
- src
- c -- lib folder
- p -- page folder
Contributing
In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.
Release History
(Nothing yet)
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago