Bundling Angular JS
[code lang=”csharp”]
var scriptBundle = new ScriptBundle("~/bundles/app")
.IncludeDirectory("~/Scripts/app/", "*.js", searchSubdirectories: true);
bundles.Add(scriptBundle);
[/code]
Minification
Permasalahan dalam minification angular JS adalah sistem minification akan mengubah semua dependency yang tidak didefinisikan sebelumnya menjadi sebuah huruf.
Before Minification
[code lang=”javascript”]
app.controller(‘intraController’,
function ($scope, $rootScope, $location, $routeParams, $route, intraDataSource, intraService)
{
var intraId = $routeParams.id;
…
}
);
[/code]
After Minification
[code lang=”javascript”]
app.controller(‘intraController’,function(a,b,c,d,e,f,g){var h=d.id;…});
[/code]
Untuk mengatasi masalah tersebut, maka untuk setiap pendefinisian controller, service, model, dll yang memerlukan pendefinisian dari dependency yang digunakan, sehingga sistem minification dapat mengganggap variable dependency merupakan variable penting dan tidak diubah, seperti contoh dibawah.
Before Minification
[code lang=”javascript”]
app.controller(‘intraController’, [‘$scope’, ‘$rootScope’, ‘$location’, ‘$routeParams’, ‘$route’, ‘intraDataSource’, ‘intraService’,
function ($scope, $rootScope, $location, $routeParams, $route, intraDataSource, intraService)
{
var intraId = $routeParams.id;
…
}
);
[/code]
After Minification
[code lang=”javascript”]
app.controller(‘intraController’,[‘$scope’,’$rootScope’,’$location’,’$routeParams’,’$route’,’intraDataSource’,’intraService’,function($scope,$rootScope,$location,$routeParams,$route,intraDataSource,intraService){var h=$routeParams.id;…});
[/code]
