Front End

19 jul, 2019

Habilitando o Ivy no Angular 8

100 visualizações
Publicidade

Com o lançamento da versão 8 do Angular finalmente conseguimos utilizar o novo compilador do Framework, o Ivy.

O que é Ivy?

Quem está acompanhando as versão do Angular se deparou nos últimos tempos com o termo.

Trata-se de uma reescrita completa do compilador e tempo de execução sem alterar a forma como escrevemos aplicações em Angular.

Entre os objetivos dessa mudança, podemos listar:

  • Melhor tempo de compilação (com uma compilação mais incremental);
  • Redução do tamanhos de compilação;
  • Desbloqueie novos recursos em potencial como metaprogramação ou componentes de ordem superior;
  • Carregamento lento de componente em vez de módulos;
  • Sistema novo de detecção de alterações não baseado em zone.js.

Como Habilitar?

Projeto Novo

Podemos definir o uso do Ivy na construção do projeto.

No terminal informe:

A flag –enable-ivy já configura o projeto, definindo as configurações necessárias para uso do novo compilador.

Para um projeto existente

As seguintes alterações devem ser realizadas.

Encontre o arquivo tsconfig.app.json na raíz do projeto e defina a propriedade enableIvy para true dentro de angularCompilerOptions .

{
“compilerOptions”: { … },
“angularCompilerOptions”: {
“enableIvy”: true
}
}

O segundo passo é a definição da compilação em AOT (mais detalhes em https://angular.io/guide/aot-compiler)

No arquivo de configuração angular.json defina as opções de construção padrão para o seu projeto para sempre usar a compilação AOT.

{
"projects": {
"my-existing-project": {
"architect": {
"build": {
"options": {
...
"aot": true,
}
}
}
}
}
Está feito!!!

Não esqueça de gerar sua aplicação com ng build — — prod.

Se atualizou sua aplicação e qsuiser compartilhar, deixe nos comentários a diferença do bundle.

Até mais !

Referências