Installez gulp-htmlmin avec NPM via une commande:
NPM Installer Gulp-htmlmin --Save-Dev
Une fois l'installation terminée, ouvrez le fichier gulpfile.js, nous écrivons une tâche pour compresser spécifiquement HTML et effectuer une série de traitement sur le HTML:
var gulp = require ('gulp'); var htmlmin = require ('gulp-htmlmin'); gulp.task ('html', function () {var options = {Collapsewhitespace: true, collapsebooleAnAttributes: true, supprime: true, retiremptyAttributes: true, supprimeTypeAtTributes: true, removeStyleLinkTypeatTributes: true, minifyjs: true, minifycss: true: true: true: true: true: }; gulp.src ('app / ** / *. html'). Pipe (htmlmin (options). Pipe (gulp.dest ('dest /'));Nous voyons qu'il existe une option de réglage dans la tâche, qui introduira le rôle de leurs propriétés:
1.Collapsewspacepace: De la signification littérale, il faut voir que le nettoyage des espaces et la compression du HTML est plus important, avec un effet relativement important, et la quantité de compression causée par des changements est également particulièrement importante;
2.CollapseBooleAnAttributes: Omettez la valeur de l'attribut booléen, telles que: <input checked = "checked" />, puis après avoir réglé cet attribut, il deviendra <entrée vérifiée />;
3.RemoveComents: effacez les commentaires dans le HTML, nous devons réduire les commentaires dans la page HTML.
4. REMOVEEMPTYATTRIBUTES: Effacer tous les attributs vides,
5.RemoveSciptTypeAtTributes: effacez l'attribut type = "text / javascript" dans toutes les balises de script.
6.RemovestyleLinkTypeAtTributes: Effacez les attributs de type sur toutes les balises de liaison.
7.minifyJS: COMPRESS JavaScript Code dans HTML.
8.MINIFYCSS: Compressez le code CSS dans HTML.
En bref, le principe de compression de HTML est d'effacer le code inutile, de supprimer les attributs avec des valeurs par défaut et de compresser HTML au minimum, afin d'améliorer les performances de l'opération du projet.