时间:2021-05-28
通过一条命令用Npm安装gulp-htmlmin:
npm install gulp-htmlmin --save-dev
安装完毕后,打开gulpfile.js文件,我们里面编写一个task用来专门压缩html,并对html进行一系列的处理:
我们看到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压缩的最小,这样才能提高项目运行的性能。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
什么是gulp?gulp是新一代的前端项目构建工具,你可以使用gulp及其插件对你的项目代码(less,sass)进行编译,还可以压缩你的js和css代码,甚至
废话不多说,直接上代码//引入插件vargulp=require('gulp');//varProxy=require('gulp-connect-proxy'
gulp类似于grunt,都是基于Node.js的前端构建工具。不过gulp压缩效率更高。一.安装gulp 首先,你要安装过nodejs,如果没有安装过的同学
npminstallgulp--save-dev什么是gulp?gulp是新一代的前端项目构建工具,你可以使用gulp及其插件对你的项目代码(less,sass
很久以前,我们在"细说gulp"随笔中,以压缩JavaScript为例,详细地讲解了如何利用gulp来完成前端自动化。再来短暂回顾下,当时除了借助gulp之外,