Mvc4捆绑,缩小和AngularJS服务

时间:2013-02-16 11:00:39

标签: asp.net-mvc asp.net-mvc-4 angularjs bundling-and-minification

有没有办法自定义Asp.Net MVC4捆绑和缩小功能缩小js文件的方式?

意思是,我不想完全关闭缩小,但“按原样”它只是打破了AngularJs。

由于AngularJs使用DI和IoC方法在控制器中注入服务,因此:

function MyController($scope) { }

缩小后,变为:

function MyController(n) { }

通常情况下这不会有问题,但AngularJs使用参数名来了解要注入的服务。因此$ scope应保持$ scope,以及角度控制器中的任何其他参数。其他所有东西,如局部变量等,都应该正常缩小。

我找不到任何关于如何配置Mvc4缩小的明确文档,而且它似乎相当愚蠢,因为它“全有或全无”,所以我想我错过了什么。

感谢。

3 个答案:

答案 0 :(得分:45)

实际上你可以(而且应该!)编写AngularJS代码,这样它就是“缩小安全性”。详细信息在http://docs.angularjs.org/guide/di的“依赖关系注释”部分中进行了描述,但简而言之,对于全局定义的控制器,您可以编写:

MyController.$inject = ['$scope'];

请注意,全局定义的控制器正在污染全局命名空间(有关详细信息,请参阅this),应避免使用。如果您在模块级别声明控制器,您也可以使其缩小安全性:

angular.module('mymodule', []).controller('MyController', ['$scope', function($scope){
//controller code goes here
}]);

答案 1 :(得分:1)

如果您仍想控制缩小和不缩小的内容(或者如果您想要包含插件供应商已经缩小的版本),只需声明两个捆绑包,并且只在BundleConfig.cs中缩小其中一个:

var dontMinify = new Bundle("~/bundles/toNotMinify").Include(
                        "~/Scripts/xxxxx.js");
bundles.Add(dontMinify);

var minify = new Bundle("~/bundles/toNotMinify").Include(
                        "~/Scripts/yyyyyy.js");
minify.Transforms.Add(new JsMinify());
bundles.Add(minify);

答案 2 :(得分:1)

对于那些不想要/不能被诅咒的人来说,#min; minification-safe" angular-DI语法,并不关心变量名称被混淆,我使用BundleTransfomer和Yui Js minifier - 可通过nuget获得:

 Install-Package BundleTransformer.Core
 Install-Package BundleTransformer.Yui

对缩小/混淆进行非常精细的控制。在角度世界中,只需将yui web.config部分中的obfuscateJavascript设置为false。