Siz foydalanadigan 6 muhim Grunt plaginlari

Muallif: Lewis Jackson
Yaratilish Sanasi: 6 Mayl 2021
Yangilanish Sanasi: 15 Mayl 2024
Anonim
Siz foydalanadigan 6 muhim Grunt plaginlari - Ijodiy
Siz foydalanadigan 6 muhim Grunt plaginlari - Ijodiy

Tarkib

Grunt kabi JavaScript-ni ishga tushiruvchilar oldingi ishlab chiquvchilar tomonidan juda mashhur bo'lib qoldilar. Buning sababi shundaki, ular bizning ishimizda bajarishni istagan bir narsani - vaqtni tejashga yordam beradi!

Ammo hozirda 5000 dan ortiq (va hisoblashda) Grunt plaginlari mavjud bo'lsa, ishlab chiquvchilar o'sha "olmoslarni" qo'pol ravishda topishlari mumkin. Siz foydalanadigan Grunt plaginlarining mukammal retseptini topish uchun Gruntga kirib qolgan vaqtimizga nazar tashladik.

01. Ufflify

O'zining tuziga loyiq bo'lgan har qanday oldingi ishlab chiquvchi JavaScript-fayllarni minimallashtirishning afzalliklari haqida biladi va aynan shu plagin ishlaydi. Bu uning mashhurligi, aslida u "Grunt Ishga kirishish" qo'llanmasiga kiritilgan. Nomiga qaramay, ushbu plagin sizning JavaScript-kodingizni ham chiroyli qilish uchun ishlatilishi mumkin - garchi bu ishlab chiqarishdan foydalanish uchun ayniqsa foydali bo'lmasa.


02. Sass

CSS oldingi protsessori haqiqatan ham qaysi qatorni boshqarishi haqida munozaralar bo'lishi mumkin, ammo biz bu erda Stickyeyes-da uning asosiy raqibi Lessga emas, balki Sass-ga qaror qildik. Ushbu plagin bizning Sass fayllarimizni yozishimiz va ularni CSS-ga avtomatik ravishda to'plashimizga imkon beradi. CSS oldingi protsessoridan foydalanishning o'zi alohida maqolani kafolatlaydi, ammo shuni aytish mumkinki, agar siz allaqachon foydalanmayotgan bo'lsangiz, siz partiyaga juda kech qoldingiz!

03. CSSMin

Ushbu plagin Uglify-ning CSS ekvivalenti. Bu shunchaki ko'rsatilgan CSS fayllarini oladi va ularni kichraytiradi. Albatta, agar siz buni Sass plaginida birgalikda ishlatmoqchi bo'lsangiz, unda ushbu vazifa Sass vazifasidan keyin bajarilishini ta'minlashingiz kerak.

CSSMin-ga juda ko'p alternativalar mavjud, ular CSS-fayllar hajmini biroz boshqacha uslublar yordamida kamaytirishi mumkin; CSS nano, CSS siqish, CSS kichrayishi va boshqalar. Agar siz bunday turdagi narsalar bilan tanishsangiz, ushbu qulay ko'rsatkichni o'qing.

04. Konkat

Nomidan ko'rinib turibdiki, ushbu plagin bir nechta fayllarni oladi va ularni bitta faylga biriktiradi. Minimal kodda bo'lgani kabi, fayllarni birlashtirish ham sahifalarni yuklash vaqtini qisqartirish bo'yicha azaliy eng yaxshi amaliyotdir.


Fayllarni birlashtirish har doim JavaScript va CSS uchun ishlab chiqarishda ishlatilishi kerak. Bu odatda bajariladigan oxirgi vazifa - CSS-ni qayta ishlash vazifasi va minifikatsiya qilish vazifasidan keyin. Ushbu plaginni ma'lum bir katalogdagi barcha fayllarni birlashtirishni aytish juda oson, lekin fayllar birlashtirilishidan ehtiyot bo'ling - siz aniq buyurtma berishingiz yoki fayllarni nomlashingiz kerak bo'lishi mumkin, shunda ular har doim kerakli tartibda birlashtiriladi. .

05. ImageMin

CSSMin va Uglify bilan bir xil yo'nalishda ImageMin sahifani yuklash uchun yana bir eski muammo - rasm fayllari hajmini hal qiladi. Rasmni "minimallashtirish" odatda optimallashtirish uchun birinchi chaqiriq portidir, shuning uchun ushbu plagin sahifa fayllarining umumiy hajmini iloji boricha kamaytirish uchun juda muhimdir.

Agar siz JPG, PNG, GIF yoki SVG (tobora ommalashib borayotgan vektorli tasvir formati) bilan ishlayotgan bo'lsangiz, ushbu plagin sizning rasmlaringiz fayl hajmini yo'qotmasdan qisqartirishni ta'minlaydi, barmog'ingizni ko'tarmasdan. Agar sizning loyihangizda ko'plab rasmlar mavjud bo'lsa, ushbu vazifani tomosha tadbirida bajarishdan ko'ra, faqat ishlab chiqarishga borganingizda bajarishingiz yaxshi bo'ladi (keyingi bandga qarang).


06. tomosha qiling

Ushbu plagin aslida veb-saytingizning oldingi qismiga ta'sir qilmaydi, ammo bu samarali Grunt jarayonini yaratishda juda foydali. Soat siz ko'rsatgan barcha kataloglarni kuzatib boradi va agar biror narsa o'zgargan bo'lsa, u avtomatik ravishda ba'zi Grunt vazifalarini bajaradi.

Shunday qilib, siz JavaScript-ni bajarish uchun 'js' katalogingizda bitta tomosha shartini, va CSS-dagi vazifalarni bajarish uchun boshqasini 'css' katalogingizda o'rnatishingiz mumkin. Bu shuni anglatadiki, siz hech qachon asosiy Grunt jarayonini qo'lda bajarishingizga to'g'ri kelmaydi! O'zgarishlar kiritishni boshlashdan oldin, xirillab tomosha qilish vazifasini boshlang va u erda ham borligini unutishingiz mumkin.

So'zlar: Jeymi Shilds

Jeymi Shilds - bu raqamli marketing agentligi Stickyeyes-ning orqa ishlab chiqaruvchisi.

Shunga o'xshash? Buni o'qing!

  • Grunt va Gulp: Qaysi JavaScript-ni yaratish vositasini tanlashingiz kerak?
  • Grunt sozlamalarini yaxshilashning 8 usuli
  • Eng yaxshi bepul WordPress mavzular
So’Nggi Xabarlar
Kunning shrifti: Organico
Davomini O’Qish

Kunning shrifti: Organico

Bu erda Creative Bloq-da biz tipografiyaning katta muxli larimiz va biz doimo yangi va qiziqarli hriftlarni qidirmoqdamiz - ayniq a bepul hriftlar. hunday qilib, agar iz o'nggi dizayningiz uchun h...
Semantik tipografiyaning A-Z
Davomini O’Qish

Semantik tipografiyaning A-Z

hu oyning bo hida biz Dji Lining aqlli ijodlari orqali emantik tipografiya - o'zlarning ma'no ini aniq ta virlab beradigan turdagi ra mlar tu huncha ini taqdim etdik. U hbu po t juda ma hhur ...
Codio kodlash uchun "olomonni o'qitishni" chaqiradi
Davomini O’Qish

Codio kodlash uchun "olomonni o'qitishni" chaqiradi

Frontion veb-i hlab chiqi h vo ita i Codio ortidagi guruh "maktablarda kodla hni o'qiti hda o'quvdan keyingi yonda huvni" talab qildi.Kompaniya o'z veb- aytida kodla h bo'yic...