5

Quando eu faço a minificação no angular tudo para de funcionar

1

2 Respostas 2

6

O problema é que o processo de minificação altera o nome dos parâmetros das funções. Não há problema algum nisso, contanto que o novo nome seja trocado em todos os lugares em que é usado, porém o sistema de injeção de dependências do Angular é baseado no nome dos parâmetros. A conclusão disso é que nada mais funcionará no Angular após a minificação, já que os parâmetros das funções serão trocados por outros nomes aleatórios e menores que não tem nada a ver.

Para solucionar este problema, o Angular possui o annotation system, um sistema de anotação que permite dizer o que deve ser injetado para cada parâmetro do controller, mesmo que seu nome seja trocado.

Exemplo:

angular.module('qualquer')
    .controller('QualquerController', function($scope, $routeParams) {
            // seu código 
    });

Vira:

angular.module('qualquer')
    .controller('QualquerController', [$scope, $routeParams] {
            //  seu código 
    });

Veja que o segundo parâmetro do controller é um array que recebe primeiro todos os artefatos que o controller do Angular receberá e por último a função que define o controller. O processo de minificação jamais tocará nos dados do array e o Angular segue a convenção que o primeiro parâmetro do array será injetado como primeiro parâmetro da função do controller. Se o nome do parâmetro da função do controller muda, tudo continuará funcionando.

5

Como foi respondido antes, o processo de build renomeia as declarações de funções, mas preserva o array com o nome que deveria dar match na injeção de dependência.

Não sei ao certo como você está fazendo o processo de minificação, mas se estiver usando algum task runner como Grunt, Gulp ou Webpack o ng-annotate resolve a sua vida.

Ele preserva o nome das dependências importadas no processo de build.

Aqui tem a documentação: https://github.com/olov/ng-annotate e aqui os tutoriais para usar com task runners: https://github.com/olov/ng-annotate#tools-support

1
  • 1
    +1 pela menção ao ng-annotate. A pergunta é focada no processo de minificação, e não na alteração do conteúdo do projeto.
    – OnoSendai
    Commented 26/03/2017 às 20:08

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .