Instal Gulp-Htmlmin dengan NPM melalui satu perintah:
NPM menginstal gulp-htmlmin-save-dev
Setelah instalasi selesai, buka file GulpFile.js, kami menulis tugas untuk secara khusus mengompres HTML dan melakukan serangkaian pemrosesan pada HTML:
var gulp = membutuhkan ('gulp'); var htmlmin = membutuhkan ('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'). pipa (htmlmin (opsi)). pipa (gulp.dest ('dest/'));Kami melihat bahwa ada opsi pengaturan dalam tugas, yang akan memperkenalkan peran properti mereka:
1.Collapsewhitespace: Dari makna literal, harus dilihat bahwa ruang kliring dan mengompresi HTML lebih penting, dengan efek yang relatif besar, dan jumlah kompresi yang disebabkan oleh perubahan juga sangat besar;
2.CollapsebooleanAttributes: hilangkan nilai atribut boolean, seperti: <input checked = "checked"/>, lalu setelah mengatur atribut ini, itu akan menjadi <input checked/>;
3.Removecomments: Hapus komentar di HTML, kita harus mengurangi komentar di halaman HTML.
4.RemoveEmptyaTtributes: Bersihkan semua atribut kosong,
5.RemovesciptTypeattributes: Hapus atribut type = "text/javascript" di semua tag skrip.
6.RemovestylelinkTypeattributes: Hapus atribut tipe pada semua tag tautan.
7.minifyjs: Compress JavaScript Code di HTML.
8.MinifyCSS: Kompres kode CSS di HTML.
Singkatnya, prinsip mengompresi HTML adalah untuk menghapus kode yang tidak berguna, menghapus atribut dengan nilai default, dan mengompres HTML ke minimum, sehingga dapat meningkatkan kinerja operasi proyek.