Създайте първата ни задача с Grunt

Съдържание
Инсталирането и установяването на Grunt Това е нещо доста просто за правене, но след като имаме всички инструменти и знаем някои от основните команди, често се чудим какво можем да направим сега? Следващата стъпка е много проста, време е да започнете да изграждате задачи.
Идеята зад дадена задача е, че тя може да реши нещо, което често се случва по време на нашия работен ден или разработване на приложения, където повтарящи се по природа, можем да зададем параметри на тези задачи и по този начин те винаги могат да работят без да е необходимо да ги правите от нулата.
ИзискванияТози урок препоръчва да знаете основните основи на JavaScript защото ще използваме много неща от този език. Друго съществено изискване е, че трябва да сме инсталирали и конфигурирали Grunt в нашата система или пясъчник, това означава, че трябва да имаме Node.js, вашия мениджър на пакети npm и разбира се Grunt. Накрая трябва да имаме текстов редактор, който да създава съдържанието на нашите упражнения, и достатъчно разрешения за създаване на файлове и свободно изпълнение на командата grunt в конзолата.
Задачата е дейност, която има начало, развитие и край Grunt задачата не е нищо повече от функция в JavaScript който се съдържа във файла Gruntfile.js и това при изпълнение на командата мрънка в нашата конзола можем да накараме тази функция да бъде изпълнена, което ще доведе до стартиране на нейното съдържание.
Задачите се управляват по модулен начин, много в стила на основната конституция на Node.jsЗатова всеки път, когато дефинираме нов набор от задачи, трябва да добавяме инструкциите, които показват тяхната модулност.
За да създадем задача, се нуждаем от основен код в нашия файл gruntfile.js, този код се извиква стереотипния тъй като се повтаря, но ние го използваме само веднъж, нека видим как изглежда:
 module.exports = function (grunt) {// ето съдържанието на нашите задачи};
След като сме поставили този код в нашия файл, вече имаме основата или конституцията, за да можем да създаваме нашите задачи. След като това бъде направено, ще направим задача, която ни позволява да напишем съобщение чрез конзола, за това ще напишем следния код:
 module.exports = function (grunt) {grunt.registerTask ('default', function () {console.log ('Здравейте, хвърлихме съобщение в Grunt.');});};
Това, което направихме, е много лесно за обяснение, първо взехме обекта мрънка които създаваме с нашия код стереотипния, тогава в този обект сме изпълнили метода registerTask какво ни помага да разкажем Grunt че добавяме нова задача, следващ акт му даваме име и след това с анонимна функция му предаваме съдържанието на нашата задача, което в този случай е съобщението на конзолата.
Нека да видим как изглежда този пример при изпълнение на задачата, за него в папката, където запазваме нашия файл gruntfile.js ще изпълним следната команда:
 мрънка
Къде тогава конзолата трябва да ни даде резултат като следния:

Важно е да споменем, че използваме името по подразбиране за тази задача, защото това е задачата Grunt ще търси по подразбиране, както името му показва в нашия файл gruntfile.js, ако нямаше това име, щяхме да получим грешка при изпълнение мрънка както виждаме на следното изображение:

Предишният ни пример, въпреки че работи, не е най -препоръчителният, просто използвахме конзолата Node.js но това няма всички функционалности и свойства на конзолата Grunt така че ако имаме някаква допълнителна информация от машината на задачите, със сигурност няма да я видим. Ето защо трябва да използваме конзолата на нашия двигател за автоматизация на задачите, концепцията във философията е практически същата, само че променяме обектите и функциите, които трябва да извикаме.
Нека да видим в следния код как можем да пренапишем кода си от предишния пример, за да можем да изпълним това, което обяснихме:
 module.exports = function (grunt) {grunt.registerTask ('default', function () {grunt.log.writeln ('Това съобщение се показва от конзолата Grunt.');});};
Как виждаме, използваме само обекта повторно мрънка инициал на файла, след това използваме неговия клас дневник и накрая методът writeln, резултатът е същият като в предишния пример само с тази разлика, че сме използвали нещо по -оптимално за нашите цели. Нека да видим на следното изображение как всичко се поддържа правилно:

В началото говорихме за задачи за многократна употреба и които ни позволяват да спестим време, едно от нещата, които могат да ни позволят да достигнем адекватна степен на повторно използване на задачите, е възможността за добавяне на параметри към тях, с това можем да променим някои стойности Според ситуацията, в която можем да се окажем, като например създаване на потребители за система директно с Grunt, с който можем да предадем като параметър име на файл със списъка с потребители.
В следния код ще направим нещо много интересно, първо ще видим как да създаваме задачи, които не са нашият процес по подразбиране, с това вече ще имаме ключа да имаме няколко задачи в един и същ файл. Параметърът, който ще получи нашата задача, просто ще бъде зададен в анонимната функция, по този начин можем да я уловим и обработим в нейното тяло.
Нека да видим кода за генериране на тази задача, като упражнение можем да поставим споменатия код след нашата задача по подразбиране, за да тестваме това, което сме обяснили:
 grunt.registerTask ('кажи здравей', функция (име) {grunt.log.writeln ('Здравей:' + име + 'добро утро днес');});
Сега, за да направим конзолното извикване на задачата, просто правим следното:
 мрънка кажи здравей: Име
Как можем да видим поставяме името на задачата и с двоеточие се разделяме, за да предадем необходимия параметър, в този случай името, което искаме да изпратим на задачата, нека видим как изглежда в нашата конзола:

Какво се случва, ако задачата ни се нуждае от предаване на два или повече параметъра, просто в кода на същия ги добавяме, разделени със запетаи като функция JavaScript нормално и когато ги извикваме в конзолата, можем да ги поставим със същия начин на разделяне, нека видим код, където изпълняваме задача, която ни показва това:
 grunt.registerTask ('add', function (value1, value2) {var sum = Number (value1) + Number (value2); grunt.log.writeln ('Резултатът от добавянето на' + value1 + ' +' + value2 + ' е: '+ сума);});
Сега нека видим как изглежда, когато преминем през конзолата този пример с извикването и отговора:

Нещо интересно, което бихме могли да забележим, е, че използваме JavaScript Плоска и лесна за дефиниране обработката, използването на този език е много важно, тъй като по този начин ще можем да разширим капацитета си за всичко, което можем да постигнем по време на изграждането на нашите задачи с Grunt.
Възможно е да използваме предупреждения в нашите задачи, с това можем да потвърдим малко получените от потребителя параметри, например предишната ни задача е сума, но ако поставим нещо различно от число, нашата операция със сигурност ще се провали, така че можем направете следното: с помощта на метода предупреждавам () Ще потвърдим, че и двата параметъра са числа и в случай, че не са, ще стартираме предупреждение:
 grunt.registerTask ('add', function (value1, value2) {if (isNaN (Number (value1))) {grunt.warn ('Първата стойност' + value1 + 'трябва да бъде число.');} if ( isNaN (Number (value2))) {grunt.warn ('Втората стойност' + value2 + 'трябва да бъде число.');} Var sum = Number (value1) + Number (value2); grunt.log.writeln ( 'Резултатът от добавянето на' + стойност1 + ' +' + стойност2 + 'е:' + сума);});
В нашия пренаписан код сме потвърдили, че ако резултатът от преобразуването в Номер () на параметрите не е число стартиране на метода предупреждавам () или предупреждение, това прекъсва нишката и показва съобщението, така че можем да избегнем грешна задача. Нека да видим как изглежда това в нашата конзола при изпълнение на задачата:

Както забелязваме и владеенето на езика JavaScript Това е много важно, така че ако сме под нивото, което искаме да достигнем, трябва да практикуваме и да се опитваме да правим колкото се може повече упражнения, за да подобрим уменията си.
С това завършихме този урок, както виждаме създаването на задачи с Grunt Той не е много сложен, по -скоро логиката му по време на определянето им ни помага да улесним разбирането за използването на инструмента. Истинската сложност е в дефиницията на нашата собствена логика в момента, в който знаем какво ще прави нашата задача и как можем да я направим възможно най -многократно използваема, тъй като ако не е така, ще работим напразно.

Така ще помогнете за развитието на сайта, сподели с приятелите си

wave wave wave wave wave