gulp-htmlmin压缩html的gulp插件实例代码
作者:tpf1220 时间:2023-08-06 01:20:18
通过一条命令用Npm安装gulp-htmlmin:
npm install gulp-htmlmin --save-dev
安装完毕后,打开gulpfile.js文件,我们里面编写一个task用来专门压缩html,并对html进行一系列的处理:
var gulp = require('gulp');
var htmlmin = require('gulp-htmlmin');
gulp.task('html',function(){
var options = {
collapseWhitespace:true,
collapseBooleanAttributes:true,
removeComments:true,
removeEmptyAttributes:true,
removeScriptTypeAttributes:true,
removeStyleLinkTypeAttributes:true,
minifyJS:true,
minifyCSS:true
};
gulp.src('app/**/*.html')
.pipe(htmlmin(options))
.pipe(gulp.dest('dest/'));
});
我们看到task里面有个设置选项,分别介绍一下他们的属性的作用:
1.collapseWhitespace:从字面意思应该可以看出来,清除空格,压缩html,这一条比较重要,作用比较大,引起的改变压缩量也特别大;
2.collapseBooleanAttributes:省略布尔属性的值,比如:<input checked="checked"/>,那么设置这个属性后,就会变成 <input checked/>;
3.removeComments:清除html中注释的部分,我们应该减少html页面中的注释。
4.removeEmptyAttributes:清除所有的空属性,
5.removeSciptTypeAttributes:清除所有script标签中的type="text/javascript"属性。
6.removeStyleLinkTypeAttributes:清楚所有Link标签上的type属性。
7.minifyJS:压缩html中的javascript代码。
8.minifyCSS:压缩html中的css代码。
总之,压缩Html的原则就是清除没用的代码,删除本就默认值的属性,将html压缩的最小,这样才能提高项目运行的性能。
标签:gulp,html,min
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
Python之OptionParser模块使用详解
2021-03-08 14:07:48
Python 内置函数速查表一览
2021-10-30 07:43:06
VS2019 自定义项目模板的实现方法
2022-05-08 21:14:23
![](https://img.aspxhome.com/file/2023/6/112086_0s.png)
FrontPage2002简明教程六:图片库
2008-09-17 11:30:00
Pygame游戏开发之太空射击实战精灵的使用上篇
2023-06-25 01:04:17
![](https://img.aspxhome.com/file/2023/6/66346_0s.png)
php字符串函数学习之strstr()
2024-05-11 10:02:07
注册和填表中常见的中英文对照
2008-07-26 12:12:00
Python函数中的可变长参数详解
2022-08-01 06:04:57
![](https://img.aspxhome.com/file/2023/4/71314_0s.png)
ES6深入理解之“let”能替代”var“吗?
2024-05-28 15:41:33
Python实现的将文件每一列写入列表功能示例【测试可用】
2022-12-05 15:12:31
![](https://img.aspxhome.com/file/2023/8/67408_0s.png)
Python如何使用字符打印照片
2023-06-12 09:20:34
![](https://img.aspxhome.com/file/2023/1/67241_0s.jpg)
python字典如何获取最大和最小value对应的key
2021-07-10 11:14:22
python 统计列表中不同元素的数量方法
2023-10-16 05:22:33
Python实现复制文档数据
2022-07-15 02:39:32
Python利用pygame模块制作代码雨
2021-02-13 02:53:24
![](https://img.aspxhome.com/file/2023/3/76923_0s.png)
深度学习Tensorflow 2.4 完成迁移学习和模型微调
2023-12-04 14:56:17
![](https://img.aspxhome.com/file/2023/0/101260_0s.png)
使用shell检查并修复mysql数据库表的脚本
2024-01-27 23:52:35
python实现Adapter模式实例代码
2021-10-20 00:43:02
![](https://img.aspxhome.com/file/2023/0/127840_0s.png)
Python实现合并同一个文件夹下所有txt文件的方法示例
2023-10-11 00:24:22
![](https://img.aspxhome.com/file/2023/3/104903_0s.jpg)
Python time.time()方法
2022-11-27 16:55:47
![](https://img.aspxhome.com/file/2023/6/127276_0s.png)