grunt插件之Grunt-contrib-htmlmin

https://github.com/gruntjs/grunt-contrib-htmlmin

Grunt-contrib-htmlmin

压缩HTML

安装：

npm install grunt-contrib-htmlmin --save-dev

载入任务：

grunt.loadNpmTasks('grunt-contrib-htmlmin');

Options 选项

以下选项类型均为布尔型，默认值均为false。

removeComments

删除HTML注释

removeCommentsFromCDATA

删除<script>和<style>标签内的HTML注释

removeCDATASectionsFromCDATA

类型：布尔

默认：false

删除<script>和<style>标签中的CDTA区段

collapseWhitespace

删除文档树中文本节点的空白。不会影响重大的空白，比如在SCRIPT,STYLE,PRE或TEXTAREA等元素内容。

collapseBooleanAttributes

删除布尔属性

<input disabled="disabled"> => <input disabled>

removeAttributeQuotes

删除属性的引号，当安全的情况下。

removeRedundantAttributes

删除多余的属性，像type="text/javascript"。

useShortDoctype

用短的HTML5的<!DOCTYPE html>代替doctype

removeEmptyAttributes

删除空（或空白）属性

removeOptionalTags

一些元素允许省略标签，像</td>

removeEmptyElements

删除空元素

 

例：

复制代码
 1 npm init
 2 
 3 npm install grunt-contrib-htmlmin --save-dev
 4 
 5 Gruntfile.js文件如下
 6 
 7 Module.exports = function(grunt){
 8 
 9 grunt.initConfig({
10 
11   htmlmin: {                                     // Task
12 
13     dist: {                                      // Target
14 
15       options: {                                 // Target options
16 
17         removeComments: true,
18 
19         collapseWhitespace: true
20 
21       },
22 
23 files: {
24 
25 'dest/browser.html': 'src/broswerinnerheight.html',
26 
27 'dest/iframe.html': 'src/iframe.html'
28 
29 }
30 
31     }
32 
33   }
34 
35 });
36 
37 grunt.loadNpmTasks('grunt-contrib-htmlmin');
38 
39 grunt.registerTask('default', ['htmlmin']);
40 
41 }
复制代码

 

grunt

 

CDATA 的意思是字符数据（character data）。在XML中，只有CDATA区段（CDATA section）的文本会被解析器忽略。

在XML元素中，“<”和“&”是非法的。某些文本，如JavaScript代码，包含大量的“<”和“&”。为了避免错误，可以将脚本代码定义为CDATA。

一个CDATA区段以“<![CDATA[”标记开始，以“]]”标记结束：

复制代码
 1 <script>
 2 
 3 <![CDATA[
 4 
 5 function matchwo(a,b)
 6 
 7 {
 8 
 9 if (a < b && a < 0) then
10 
11   {
12 
13   return 1;
14 
15   }
16 
17 else
18 
19   {
20 
21   return 0;
22 
23   }
24 
25 }
26 
27 ]]>
28 
29 </script>
复制代码

 

上例中，解析器会忽略CDATA部分的所有代码。

 

posted on   随啵不逐流  阅读(1690)  评论(0)  编辑  收藏  举报

努力加载评论中...
点击右上角即可分享
微信分享提示