Solucionado (ver solução)
Solucionado
(ver solução)
8
respostas

Dúvida no Ex. 2 da Aula 1 - Introdução

Infelizmente para mim a instalação não ficou nada claro! Falamos em instalar o grunt usando npm, mas qual ferramenta usar?! Um bloco de notas ou outro editor de código qualquer, tentei algumas alternativas e nada... Já instalei o node.js

8 respostas

Você pode usar seu editor favorito, eu uso sublime, e você? .

Não indico editor porque há aqueles que sentem dificuldade não com o Grunt, mas com o editor. Aliás é uma escolha muito pessoal.

Se você instalou o Node e seu npm está funcionando e não tem editor favorito, um bom começo é o notepad++ no Windows.

Essas informações ajudam? Era essa mesma sua dúvida? Confirme para mim.

Estou usando o phpstorn, consegui instalar o grunt, porém não consegui criar uma copia dentro da pasta projeto. Aparece no diretório denominado (NOTE) uma pasta node_mode, dentro desta outras duas, uma pasta grunt e outra grunt-contrib-copy. Quando tentei configurar o GRUNTFILE para criar cópia dos arquivos da pasta public não deu certo.. Você pode me ajudar?

Flávio, posso usar o Windows PowerShell para instalar npm? Ou devo usar o Node.js command prompt memso?!

solução!

Claro que posso ajudar, vamos por partes. Vamos começar do zero, zero mesmo. Ignore o que você já fez.

Verificando se o Node foi instalado

Quando você instala o Node, automaticamente o npm é instalado. Este é o gerenciador de pacotes do Node. Como saber se o Node está instalado certinho?

Abra seu terminal, pode ser ainda em qualquer pasta e escreva:

node --version

Se a versão do Node for exibida, beleza, está instalado, inclusive o npm.

Vamos lá. O Grunt e seus plugins nada mais são do que módulos do Node.js. Certo?

Criando o arquivo package.json

Muito bem, no primeiro capítulo há um projeto que deve ser baixado. Ele não tem nada demais, apenas HTML, CSS que iremos realizar um monte de transformações com o Grunt.

É muito importante que você entre na pasta do projeto descompactada e lá execute os comandos a seguir:

npm init

Esse comando cria o arquivo package.json. É nele que ficarão registrados todos os módulos que você instalar do Node. Certo? Ah Flávio, quero saber quais são os módulos que estão sendo usados: basta abrir esse arquivo. Mas ele ainda não tem nenhum módulo, é o que faremos agora:

Instalando o grunt

Dentro da pasta do projeto(isso é muito importante, você estar dentro desse diretório do projeto quando for rodar qualquer comando do Node e do Grunt em nosso projeto. Se tiver dúvida no prompt do windows diga para mim qual é.)

Bom, o primeiro passo é instalar o Grunt. Fazemos isso com o comando no terminal:

npm install grunt --save

Que raio de pasta é essa, node_modules?

Isso baixará o Grunt. O curioso que você já percebeu é que automaticamente é criada uma pasta chamada node_modules dentro da pasta do projeto que você baixou e na qual você está dentro do diretório. Para cada módulo baixado, mais uma pasta será criada dentro de node_modules. Por enquanto temos dentro dela apenas o grunt. Ok?

Privilégio de administrador necessário

Só que isso não é suficiente, é aqui que você precisa ter privilégio de administrador para executar o comando:

npm install grunt-cli -g

Esse comando permite que você chame o grunt pelo terminal em qualquer pasta do seu sistema. Eu aconselho no Windows, depois de rodar esse comando, fechar o terminal e depois abri-lo voltando para dentro da pasta do nosso projeto, certo?

Testando o Grunt

Será que o grunt está globalmente instalado? No seu terminal escreva

grunt

Problemas podem acontecer

É claro que dará um erro, porque ele não encontra o Gruntfile.js, arquivo onde programamos todas as nossa tarefas. A ideia aqui é saber se ele está instalado direitinho.

Pronto! Agora, dentro do projeto com tudo instalado, você pode começar a escrever seu Grunfile.js seguindo as instruções e o que aprendeu no primeiro capítulo.

Deu erro, não se desespere!

Gruntfile requer muita disciplina, porque qualque erro impede a execução do seu script, mas não se desespere. Deu problema? Vai no seu consome/terminal e copia e cola a mensagem de erro e coloque ela aqui no fórum. Pode ser uma chave faltando, etc.

Phpstorm

Eu nunca trabalhei com essa sua ferramenta phpstorm, mas você não precisa de nada disso. Tente baixar o Notepad++ ou sublime que já é mais que suficiente.

Fiz um mini tutorial personalizado para você para ajudar nessa etapa incial com o grunt. Aguardo seu feedback.

Só lembrando, se o problema é quando você vai executar seu grunt para processar o Gruntfile, não deixe de postar o erro aqui no fórum. De preferência, siga a formatação indica para o código ficar bonito e me ajudar a descobrir o que esta acontecendo.

Boa noite Flávio, graças a sua paciência e total interesse em me ajudar, consegui instalar o grunt no diretório desejado. Fico feliz pelo profissionalismo de vocês. Obrigado.

Eu que agradeço por voce não ter desistido. Se pintar nova dúvida não deixe de postar aqui. Abraço e bom estudo! Estou marcando como solucionado.

Flavio Henrique é o cara!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software