Creați prima noastră sarcină cu Grunt

Instalarea și înființarea Grunt Este ceva destul de simplu de făcut, dar odată ce avem toate instrumentele și cunoaștem unele dintre comenzile de bază, ne întrebăm adesea, ce putem face acum? Următorul pas este foarte simplu, este timpul să începeți construirea sarcinilor.
Ideea din spatele unei sarcini este că poate fi ceva care poate rezolva probleme frecvente sau activități pe care le desfășurăm întotdeauna în timpul zilei noastre de lucru sau de dezvoltare a aplicațiilor, unde, fiind de natură repetitivă, putem seta parametrii acestor sarcini și astfel pot funcționa întotdeauna fără a fi nevoie să le faci de la zero.
CerințeAcest tutorial vă recomandă să cunoașteți fundamentele de bază ale JavaScript pentru că vom folosi multe lucruri din acest limbaj. O altă cerință esențială este că trebuie să avem instalate și configurate Grunt în sistemul nostru sau în sandbox, acest lucru înseamnă că trebuie să avem Node.js, managerul de pachete npm și, desigur Grunt. În cele din urmă, trebuie să avem un editor de text pentru a crea conținutul exercițiilor noastre și permisiuni suficiente pentru a crea fișiere și a executa comanda grunt în consolă în mod liber.
O sarcină este o activitate care are un început, o dezvoltare și un sfârșit, în Grunt o sarcină nu este altceva decât o funcție în JavaScript care se află în dosar Gruntfile.js și asta la executarea comenzii mormăi în consola noastră putem face ca această funcție să fie executată, determinând lansarea conținutului acesteia.
Sarcinile sunt gestionate într-un mod modular, mult în stilul constituției de bază a Node.jsPrin urmare, de fiecare dată când definim un nou set de sarcini, trebuie să adăugăm instrucțiunile care indică modularitatea acestora.
Pentru a crea o sarcină, avem nevoie de un cod de bază în fișierul nostru gruntfile.js, acest cod se numește cazan deoarece este repetitiv, cu toate acestea îl folosim o singură dată, să vedem cum arată:

 module.exports = function (grunt) {// aici este conținutul sarcinilor noastre};

Odată ce am plasat acel cod în fișierul nostru, avem deja baza sau constituția pentru a ne putea crea sarcinile. Odată ce acest lucru este făcut, vom face o sarcină care ne permite să scriem un mesaj prin consolă, pentru aceasta vom scrie următorul cod:

 module.exports = function (grunt) {grunt.registerTask ('implicit', function () {console.log ('Hello, am aruncat un mesaj în Grunt.');});};

Ceea ce am făcut este foarte ușor de explicat, mai întâi am luat obiectul mormăi pe care le creăm cu codul nostru cazan, apoi în acest obiect am executat metoda registerTask ce ne ajută să povestim Grunt că adăugăm o nouă sarcină, următorul act îi dăm un nume și apoi cu o funcție anonimă îi transmitem conținutul sarcinii noastre, care în acest caz este mesajul de pe consolă.
Să vedem cum arată acest exemplu atunci când executăm sarcina, în dosarul în care salvăm fișierul gruntfile.js vom executa următoarea comandă:

 mormăi

Unde atunci consola ar trebui să ne dea un rezultat precum următorul:

Este important de menționat că folosim numele implicit pentru această sarcină, deoarece aceasta este sarcina care Grunt va căuta în mod implicit așa cum indică numele acestuia în fișierul nostru gruntfile.js, dacă nu ar avea acel nume, vom primi o eroare la executare mormăi așa cum vedem în următoarea imagine:

Exemplul nostru anterior, deși funcționează, nu este cel mai recomandat, am folosit pur și simplu consola Node.js dar aceasta nu are toate funcționalitățile și proprietățile consolei Grunt deci, dacă avem informații suplimentare din motorul de sarcini, cu siguranță nu le vom vedea. De aceea trebuie să folosim consola motorului nostru de automatizare a sarcinilor, conceptul din filosofie este practic același numai cu care schimbăm obiectele și funcțiile pe care trebuie să le numim.
Să vedem în următorul cod cum putem rescrie codul nostru din exemplul anterior pentru a putea îndeplini ceea ce am explicat:

 module.exports = function (grunt) {grunt.registerTask ('implicit', function () {grunt.log.writeln ('Acest mesaj este afisat de consola Grunt.');});};

Cum vedem, refolosim doar obiectul mormăi inițială a fișierului, apoi îi folosim clasa Buturuga și în cele din urmă metoda writeln, rezultatul este același ca în exemplul anterior doar cu diferența că am folosit ceva mai optim pentru scopurile noastre. Să vedem în următoarea imagine cum totul a fost întreținut corect:

La început am vorbit despre sarcini refolosibile și care ne permit să economisim timp, unul dintre lucrurile care ne pot permite să atingem un grad adecvat de reutilizare a sarcinilor este posibilitatea de a adăuga parametri la acestea, cu aceasta putem schimba unele valori În funcție de situația în care ne putem găsi, cum ar fi crearea de utilizatori pentru un sistem direct cu Grunt, cu care putem trece ca parametru un nume de fișier cu lista de utilizatori.
În următorul cod vom face ceva foarte interesant, în primul rând vom vedea cum să creăm sarcini care nu sunt procesul nostru implicit, cu aceasta vom avea deja cheia de a avea mai multe sarcini în același fișier. Parametrul care va primi sarcina noastră va fi pur și simplu setat în funcția anonimă, astfel putem să o captăm și să o procesăm în corpul acesteia.
Să vedem codul pentru a genera această sarcină, ca exercițiu putem plasa codul respectiv după sarcina noastră implicită pentru a testa ceea ce am explicat:

 grunt.registerTask ('spune salut', funcție (nume) {grunt.log.writeln ('Bună ziua:' + nume + 'bună dimineața azi');});

Acum, pentru a efectua apelul consolă al sarcinii, facem pur și simplu următoarele:

 mormăiește salut: Nume

Cum putem vedea plasăm numele sarcinii și cu două puncte ne separăm pentru a trece parametrul necesar, în acest caz numele pe care dorim să-l trimitem sarcinii, să vedem cum arată în consola noastră:

Acum ce se întâmplă dacă sarcina noastră are nevoie de noi pentru a trece doi sau mai mulți parametri, pur și simplu în codul aceluiași le adăugăm separate prin virgule ca funcție JavaScript normal și, atunci când îi apelăm în consolă, îi putem plasa cu același mod de separare, să vedem un cod în care executăm o sarcină care ne arată acest lucru:

 grunt.registerTask ('add', function (value1, value2) {var sum = Number (value1) + Number (value2); grunt.log.writeln ('Rezultatul adăugării' + value1 + '+' + value2 + ' este: '+ sumă);});

Acum să vedem cum arată când rulăm prin consolă acest exemplu cu apelul și răspunsul:

Ceva interesant pe care l-am putea observa este că îl folosim JavaScript Plată și simplu de definit procesarea, utilizarea acestui limbaj este foarte importantă, deoarece astfel vom putea extinde capacitatea noastră de tot ceea ce putem realiza în momentul construirii sarcinilor noastre cu Grunt.
Este posibil să folosim avertismente în sarcinile noastre, cu aceasta putem valida puțin parametrii primiți de la utilizator, de exemplu sarcina noastră anterioară este o sumă, dar dacă punem altceva decât un număr, cu siguranță, operațiunea noastră va eșua, așa că putem faceți următoarele: cu ajutorul metodei a avertiza () Vom valida că ambii parametri sunt numere și, în cazul în care nu sunt, vom lansa un avertisment:

 grunt.registerTask ('adăugați', funcție (valoare1, valoare2) {if (isNaN (Number (value1)))) {grunt.warn ('Prima valoare' + valoare1 + 'trebuie să fie un număr.');} if ( isNaN (Number (value2)))) {grunt.warn ('A doua valoare' + value2 + 'trebuie să fie un număr.');} Var sum = Number (value1) + Number (value2); grunt.log.writeln ( 'Rezultatul adăugării' + valoare1 + '+' + valoare2 + 'este:' + sumă);});

În codul nostru rescris, am validat că dacă rezultatul conversiei în Număr () parametrii nu este un număr lansați metoda a avertiza () sau avertisment, aceasta rupe firul și afișează mesajul, astfel încât să putem evita o sarcină defectuoasă. Să vedem cum arată acest lucru în consola noastră atunci când executăm sarcina:

Pe măsură ce observăm și cunoașterea limbii JavaScript Este foarte important, așa că, dacă suntem sub nivelul pe care dorim să-l atingem, trebuie să exersăm și să încercăm să facem cât mai multe exerciții pentru a ne îmbunătăți abilitățile.
Cu aceasta am terminat acest tutorial, așa cum vedem crearea de sarcini cu Grunt Nu este foarte complex, ci mai degrabă logica sa în momentul definirii acestora ne ajută să facilităm înțelegerea utilizării instrumentului. Adevărata complexitate se află în definirea propriei noastre logici în momentul în care știm ce va face sarcina noastră și cum o putem face cât mai reutilizabilă, deoarece dacă nu este, vom lucra degeaba.