Automatizando tarefas JS com Grunt
• 0 views
Você já parou pra pensar na quantidade de coisas que realiza repetidamente em seus projetos JavaScript?
Se você for um cara preocupado com a consistência do seu código talvez utiliza várias vezes ao dia o JSHint/JSLint. Quem sabe você também se preocupa com a qualidade da sua aplicação e provavelmente utiliza o QUnit para realizar testes unitários. Isso sem falar de performance, talvez você minifique e concatene seus arquivos com frequência antes de sair jogando eles online.
Durante o Rio.js Meetup desse último final de semana, o Leo Balter (@leobalter) nos apresentou uma ferramenta que vem justamente para ajudar nesse processo e hoje vim aqui compartilhar com vocês também.
O que é?
Criado pelo Ben Alman (@cowboy), o Grunt é uma ferramenta beta que você roda no terminal para automatizar tarefas (obs: se você não tem intimidade com o terminal, aproveite essa chance para se aventurar nele, não é o bicho de 7 cabeças que parece ser).
Instalando
Para começar a brincar você precisa ter o node.js e o npm (gerenciador de pacotes do node) instalados na sua máquina (não vou lhe mostrar como instalar isso, joga no Google que você encontra milhões de tutoriais).
Depois basta instalar o grunt via npm:
npm install -g grunt
Agora temos tudo pronto para executar.
Iniciando
Para dar os primeiros passos, vamos utilizar um comando que cria um scaffolding a partir de determinado template.
grunt init:TEMPLATE
Até o momento, existem 3 opções de template:
- CommonJS (veja aqui um exemplo de projeto criado com ele):
grunt init:commonjs
- jQuery (veja aqui um exemplo de projeto criado com ele):
grunt init:jquery
- Node (veja aqui um exemplo de projeto criado com ele):
grunt init:node
Mais detalhes sobre esse comando aqui
Minificação
O processo de minificação é feito utilizando o UglifyJS, basta rodar:
grunt min
Mais detalhes sobre esse comando aqui
Concatenação
Para concatenar seus arquivos JS, basta rodar:
grunt concat
Mais detalhes sobre esse comando aqui
Lint
Para validar seu código através da ferramenta JSLint, basta rodar:
grunt lint
Mais detalhes sobre esse comando aqui
QUnit
Para executar seus testes unitários com QUnit, utilizando uma instância do PhantomJS, basta rodar:
grunt qunit
Mais detalhes sobre esse comando aqui
NodeUnit
Para executar seus testes unitários com nodeunit, basta rodar:
grunt test
Mais detalhes sobre esse comando aqui
Servidor
Você também pode executar um servidor estático localmente, basta rodar:
grunt server
Mais detalhes sobre esse comando aqui
Concluindo
E é isso, espero que essa ferramenta lhe traga mais agilidade em seus projetos e te ajude, assim como tem me ajudado. Até a próxima!
Leia mais
- Introducing Grunt - Bocoup
- Meet Grunt: The Build Tool for JavaScript - Nettuts