Większość bibliotek w JavaScipt jest serwowana w postaci zminifikowanej co generalnie oznacza, iż kod został skompresowany do jednej linii, a nazwy zmiennych skrócone tak aby plik js miał jak najmniejszy rozmiar. Weźmy jako przykład uproszczony SearchRouteController:
.controller 'SearchRouteController', ($scope, $location, SpotifyApi) ->
$scope.search = $location.search().q or ''
SpotifyApi.search($scope.search, ['album', 'artist'])
.then (response) ->
$scope.searchResults = response.data
.controller('SearchRouteController', function($scope, $location, SpotifyApi) {
$scope.search = $location.search().q || '';
SpotifyApi.search($scope.search, ['album', 'artist'])
.then(function(response) {
$scope.searchResults = response.data;
});
})
Po minifikacji przez uglifyjs, będzie on wyglądał tak:
.controller("SearchRouteController",function(a,b,c){a.search=b.search().q||"",c.search(a.search,["album","artist"]).then(function(b){a.searchResults=b.data})});
Jak widać na powyższym przykładzie kod został skompresowany do jednej linii a nazwy zmiennych skrócone (a - $scope, b - $location itd.).
Problem w tym że AngularJS na podstawie nazw argumentów fukcji określa jakie dokładnie zależnośći mają być zainicjalizowane i przekazane, w momencie kiedy te nazwy będą zminifikowane kod przestanie działać. Aby temu zapobiec można zapisać kontroler w bezpieczny sposób:
.controller 'SearchRouteController', [
'$scope', '$location', 'SpotifyApi',
($scope, $location, SpotifyApi) ->
$scope.search = $location.search().q or ''
SpotifyApi.search($scope.search, ['album', 'artist'])
.then (response) ->
$scope.searchResults = response.data
]
.controller('SearchRouteController', [
'$scope', '$location', 'SpotifyApi',
function($scope, $location, SpotifyApi) {
$scope.search = $location.search().q || '';
SpotifyApi.search($scope.search, ['album', 'artist'])
.then(function(response) {
$scope.searchResults = response.data;
});
}
])
Nasza konfiguracja gulpa automatycznie konwertuje kod do
bezpiecznej postaci za pomocą
ngAnnotate
ng-strict-di
Aby zasymulować działanie aplikacji po minifikacji, bez obfuskowania kodu,
można dodać atrybut ng-strict-di do elementu z dyrektywą ng-app. Wtedy
Angular nie będzie brał pod uwagę nazw argumentów funkcji i będzie wymagał
podania nazw usług bezpośrednio, np. przez notację listową.
