تثبيت Gulp-HTMlmin مع NPM من خلال أمر واحد:
NPM تثبيت gulp-htmlmin-save-dev
بعد اكتمال التثبيت ، افتح ملف gulpfile.js ، نكتب مهمة لضغط HTML على وجه التحديد وأداء سلسلة من المعالجة على HTML:
var gulp = require ('gulp') ؛ var htmlmin = require ('gulp-htmlmin') ؛ gulp.task ('html' ، function () {var reports = {collapseWhiteSpace: true ، collapsebooleanattributes: true ، removeComments: true ، removeEmptyAttributes: true ، removescripttypeattributes: true ، removestylelinktypeattributes: true ، minifyjs: true ، minifycs: true } ؛ gulp.src ('app/**/*. html'). الأنابيب (htmlmin (خيارات)).نرى أن هناك خيار الإعداد في المهمة ، والتي ستقدم دور خصائصها:
1. collapsewhitespace: من المعنى الحرفي ، ينبغي أن نرى أن مساحات المقاصة وضغط HTML أكثر أهمية ، مع تأثير كبير نسبيًا ، وأن كمية الضغط الناتجة عن التغييرات هي أيضًا كبيرة بشكل خاص ؛
2.CollapSebooleAnattributes: حذف قيمة السمة المنطقية ، مثل: <إدخال checked = "checked"/> ، ثم بعد تعيين هذه السمة ، ستصبح <إدخال/> ؛
3. RemoVecomments: قم بمسح التعليقات في HTML ، يجب أن نقدم التعليقات في صفحة HTML.
4.RemoveMePtyAttributes: مسح جميع السمات الفارغة ،
5.RemovesCiptTypeatTributes: قم بمسح سمة type = "text/javaScript" في جميع علامات البرنامج النصي.
6.RemovEstylElinkTyPeattributes: امسح سمات النوع على جميع علامات الارتباط.
7. MinifyJS: ضغط رمز JavaScript في HTML.
8.MinifyCSS: ضغط رمز CSS في HTML.
باختصار ، يتمثل مبدأ ضغط HTML في مسح رمز عديمة الفائدة ، وحذف السمات بالقيم الافتراضية ، وضغط HTML إلى الحد الأدنى ، وذلك لتحسين أداء تشغيل المشروع.