Pojďme si ukázat nástroj, který za mne dělá špinavou práci. Všechny procesy které děláte stále ručně do kola se většinou dají zautomatizovat. Já je nechávám na Gruntu aby je udělal za mne. Stroj nedělá chyby a je rychlý.
Dnes si ukážeme úvod do Gruntu. S Gruntem spolupracuje další skvělý nástroj – Bower. Ale o tom až někdy příště.
Pro zprovoznění programu Grunt je nutné nainstalovat node.js
Z webu stáhneme instalaci (tlačítko INSTALL) a nainstalujeme. Instalaci stačí odklikat. Po dokončení instalace pro jistotu restartujeme PC.
Přesvědčíme se že máme správně nainstalovaný node.js. Spustíme příkazovou řádku ( Start -> Příslušenství -> Příkazový řádek ). Do příkazové řádky zadáme příkaz node a potvrdíme klávesou ENTER:
Součástí každého projektu by měl být soubor package.json. Vytvoříme ho příkazem:
npm init
package.json obsahuje základní informace o projektu ( autor, verze, verzi Node, závislé balíčky a jejich verze, …) je to něco jako composer.json pro php. Pokud si projekt s tímto souborem stáhnete, jednoduše nainstalujete všechny potřebné balíčky příkazem:
npm install
Instalace Grunt
npm install -g grunt npm install -g grunt-cli npm install grunt --save-dev //musim provest i tento prikaz
Parametr -g říká, že Grunt instalujeme globálně.
Úspěšné nainstalování Gruntu prověříme příkazem:
grunt
Z hlášky v konzoli je vidět že nemáme soubor Gruntfile.js pojďme si ho vytvořit (ten musíme vytvořit ručně):
module.exports = function(grunt) {
grunt.initConfig({
section: {
foo: [1, 2, 3],
bar: 'hello world',
baz: false
}
})
grunt.task.registerMultiTask('section', 'run section.', function() {
grunt.log.writeln(this.target + ': ' + this.data);
});
grunt.task.registerMultiTask('section', 'run section.', function() {
grunt.log.writeln(this.target + ': ' + this.data);
});
grunt.registerTask('only-baz', ['section:baz']);
}
Vytvořili jsme 2 tasky:
- section – multiTast vykoná všechny tasky v sekci section
- only-baz – vykoná pouze 1 task ze sekce section ( section -> baz )
Neužitečný příklad výstupu, ovšem nutný pro pochopení fungování Gruntu. Příště si ukážeme zajímavější použití v praxi 🙂