om du någonsin har arbetat med kod har du hört frasen ”Keep it DRY” (” Don ’t Repeat Yourself”). Med andra ord, om du måste utföra en uppgift upprepade gånger, hitta ett sätt att göra det mer effektivt–vilket vanligtvis betyder mindre kod.

när vi börjar utveckla ett nytt projekt upprepar vi ofta samma saker om och om igen–saker som att optimera bilder, minifiera kod och sammanställa filer. I vissa fall upprepade vi oss flera gånger i minuten. Tidskostnaden för dessa uppgifter lägger snabbt till när vi gör ändringar eller skapar nya filer.

det är fruktansvärt ineffektivt. För att inte tala om att det lägger till slitage på våra fingrar och tangentbordstangenter. Uppgift löpare är här för att hjälpa!

Vad är en Uppgiftslöpare?

Uppgiftslöpare gör bokstavligen just det… de kör uppgifter. Kodare kan ange vilka uppgifter de vill att en uppgiftslöpare ska utföra, och det kommer att göra allt arbete för dem.

innan uppgiftslöpare, om du ville kompilera Sass, kör Autoprefixer och sedan minifiera den resulterande CSS varje gång du gjorde en ändring, skulle du ha tvingats slutföra varje uppgift separat. Naturligtvis skulle det bli irriterande riktigt snabbt. För att inte tala om att du skulle slösa bort en otrolig tid på att upprepa dig själv. Inte kul.

med en uppgiftslöpare kan du ange de uppgifter du vill slutföra, köra den en gång och det kommer att göra allt arbete för dig. Spara tid, spara pengar och rädda världen (kanske?).

det finns en massa uppgiftslöpare där ute: Brunch.JS, klunk.JS, Broccoli.JS, tårta.js, och Grunt.js, bara för att nämna några inbyggda Javascript. Ja, deras namn låter som något du skulle göra under din födelsedag (förutom broccoli, som bara låter som en sorglig födelsedag), men du kan använda dessa året runt!

vår uppgift löpare val är Grunt.js

vår uppgift löpare val

vi har valt att använda Grunt.js. Det är den mest stödda och populära uppgiftslöparen på marknaden. Det fungerar genom att läsa en Grundfil som innehåller din aktivitetskonfiguration i ett Javascript-objekt. Sedan kör du ett kommando i din terminal för att ange vilken uppgift du vill köra. Lätt peasy.

din Grundfil kan vara så enkel eller robust som du vill att den ska vara, beroende på vilka uppgifter du kör.

typiska Grundfiler gör följande uppgifter:

CSS

  • kompilera Sass till CSS
  • kör Autoprefixer på den nya CSS för att fånga alla leverantörsprefix som vi kanske har missat
  • Minifiera prefixet CSS
  • uppdatera vårt CSS-banner med ny tidsstämpelinformation

Javascript

  • kolla vår javascript för fel
  • sammanfoga andra inkluderade skript i en fil
  • kontrollera igen för fel
  • minifiera skript

bilder

  • optimera alla jpg, gif eller png för att göra filstorleken mindre

andra verktyg

  • titta på filer för ändringar och kör om uppgifter efter behov
  • kör BrowserSync för testning i flera webbläsare och enheter samtidigt

du kan föreställa dig hur smärtsamt det skulle vara att behöva köra dessa uppgifter manuellt. Allt vi behöver göra är att köra ett enkelt kommando:

$ grunt

precis som magi kör det här kommandot alla våra uppgifter och sparar oss från att upprepa oss själva.

för mer information om Grunt.js, kolla in deras dokumentation och börja titta på Grundfiles.

Lämna ett svar

Din e-postadress kommer inte publiceras.