→ ng new hello-world
Se você trabalhou com Angular em algum momento, muito provavelmente já se deparou com o comando acima, certo?
A ideia dessa é mostrar com exemplos práticos como utilizar diversos comandos escondidos (nem tanto) da ferramenta Angular CLI para turbinar aquelas tarefas chatas do dia a dia.
Bora?
Começando a instalação
O mais importante agora é instalar a ferramenta que o angular disponibiliza para acelerar o processo de desenvolvimento: o Angular CLI. É bem simples, basta abrir um prompt de comando (CMD) e executar o comando abaixo:
npm install -g @angular/cli
Após alguns minutos a ferramenta de linha de comando do Angular estará pronta para ser usada.
❗ O comando mais importante do Angular CLI
→ ng new hello-world
Por que esse comando é tão importante? É por ele que tudo começa!
Qualquer projeto que usa Angular como base de um jeito ou de outro, usará esse comando. E o melhor é que podemos fazer várias coisas com esse comando principal.
Confere aí. 🙂
–routing
ng new hello-world –routing
Esse comando ‘parametrozinho’ a mais que você coloca na linha de comando, já cria pra você um arquivo de rotas. Dá pra ter uma ideia de como padronizar a nomenclatura e estrutura de arquivos de rotas que você irá desenvolver para a sua aplicação.
–prefix
ng new hello-world –prefix lib
Todo projeto Angular tem como prefixo padrão a palavra ‘app’. Se você criar qualquer coisa no angular na mão e não configurar o prefixo, o validador de códigos irá dizer que você não está seguindo o padrão de codificação.
O comando acima é muito interessante quando você está trabalhando em alguma biblioteca. Utilizar o prefixo padrão ‘app’ em uma biblioteca, deixa tudo muito genérico, e pra quem utiliza fica confuso a mistura de funcionalidade com biblioteca.
–style
ng new hello-world –style scss
Uma das grandes vantagens do angular é poder escolher como você vai usar o CSS. Pode usar ele puro e com outros preprocessadores. A ideia do parâmetro –style é poder configurar já na criação do projeto qual “tipo” de CSS você vai poder utilizar. Alguém aí gosta de trabalhar com SCSS? Deixa nos comentários!
–skipGit
ng new hello-world –skipGit=true
Se por motivos de necessidade (ou insanidade) o projeto não utilizar GIT para controle de fontes, é possível pular a inicialização do repositório GIT:) Aí é um arquivo a menos pra você pensar na cagada que está fazendo escolhendo outra ferramenta pra controle de fontes.
–skipInstall
ng new hello-world –skipInstall=true
Uma sugestão muito prática pra testar todos esses comandos de criação é utilizar o comando “–skipInstall”. Com isso é possível testar vários comandos, ver estrutura dos projetos em muito menos tempo pois a máquina só vai se encarregar de criar os arquivos do projeto e não vai instalar todos aqueles pacotes pesados de javascript que o angular precisa pra funcionar.
→ –verbose
→ ng new hello-world –verbose=true
Mas se por algum motivo um comando simplesmente dá um erro maluco (bastante rao), o comando –verbose ajudar a enxergar onde está o projeto, ou seja, dar um log mais detalhado da criação do projeto.
–minimal
ng new hello-world –minimal=true
Algumas vezes a intenção é testar alguma super hiper mini MINI implementação. Por padrão a criação de um projeto Angular, cria e instala um monte de script relacionado a testes, que não é necessário para essas provas de conceitos rápidas. O papel desse comando é agilizar a criação do projeto.
✅Simples assim!
A minha intenção aqui não foi mostrar todos os comandos e parâmetros, já que isso conseguimos encontrar facilmente na documentação do Angular, que é ótima.
A ideia foi mostrar o que eu aprendi e tentar abrir um pouco as possibilidades para alguns cenários no dia a dia.
E aí, tem algum comando que você gostaria de compartilhar para criação de projetos? Deixe sua opinião nos comentários!
Lembre-se: somos uma comunidade e é assim que crescemos 🙂
Newsletter de tecnologia
Aproveita pra assinar aqui nossa newsletter semanal de tecnologia e receber em primeira mão nossos conteúdos.
