System.Web.Optimization.JsMinify가 잘못된 JavaScript를 생성합니다.

Question

System.Web.Optimization v1.3을 사용하고 있는데, MVC 5 웹 응용 프로그램에서 JavaScript 및 CSS 파일을 번들하고 축소하는 표준 구성이라고 생각합니다. 대부분의 경우이 방법이 효과적이지만 축소 과정에서 JavaScript가 손상된 경우를 발견했습니다. 위의 코드가 더 이상 (이 정돈되어 있기 때문에) 아무것도 유용하지 않지만

이

var myApp; 
(function (myApp) { 
    myApp.module.directive("validator", [ 
     function() { 
      return { 
       link: function (scope, element) { 
        var validators = [ 
         { signal: "required", message: "Please enter a value", value: null }, 
         { signal: "email", message: "Please enter a valid email address", value: null } 
        ]; 
        $("input", element).on("blur", function() { 
         for (var i in validators) { 
          var validator = validators[i]; 
          if (scope.$parent.form[scope.modelName].$error[validator.signal]) { 
           element.removeClass("has-success"); 
           scope.errorMessage = myApp.Utility.formatString(validator.message, eval(validator.value)); 
           break; 
          } 
         } 
        }); 
       } 
      }; 
     } 
    ]); 
})(myApp || (myApp = {})); 

, 그것은 축소를 문제를 설명하지 않습니다 :

여기에 원래 AngularJS와 입력 검증 지침 무엇의 단순화 된 버전입니다. 축소 된 경우에는 다음과 같이 결과 자바 스크립트는 다음과 같습니다 축소를 루프 변수 i 원래 코드에 사용된다는 사실에도 불구하고, 매개 변수의 이름 link 기능 t 및 i을 할당 한 방법

var myApp; 

function(n){ 
    n.module.directive("validator",[ 
     function(){ 
      return{ 
       link:function(t,i){ 
        var r=[ 
         {signal:"required",message:"Please enter a value",value:null}, 
         {signal:"email",message:"Please enter a valid email address",value:null} 
        ]; 

        $("input",i).on("blur",function(){ 
         var i, 
         validator; 

         for(i in r) 
          if(validator=r[i],t.$parent.form[t.modelName].$error[validator.signal]){ 
           i.removeClass("has-success"); 
           t.errorMessage=n.Utility.formatString(validator.message,eval(validator.value)); 
           break 
          } 

        }) 
       } 
      } 
     } 
    ]) 
})(myApp||(myApp={})) 

참고.

말할 필요도없이, 이것은 코드를 분해합니다. 이 경우 루프 변수의 이름을 변경하여 문제를 해결할 수 있지만, 나는 깨닫지 못하고있는 JsMinify의 축소에 다른 불리한 결과가있을 수 있다고 우려하고 있습니다.

그래서, 내가 3 개 질문이 문제에 관한 한 :

• 가 그렇다면 내가 바로, 이것은 축소를 버그라고 가정하고 있습니까 어딘가 내가 그것을보고해야이 입니까?
• 축소 된 코드에서이 문제점의 다른 인스턴스를 찾는 실용적인 방법이 있습니까?
• System.Web.Optimization이 사용하는 JavaScript 미니 화 엔진을 대체 할 수 있습니까? 그렇다면 무엇이 좋은 대체품이 될까요?

미리 감사드립니다. 팀

업데이트 : 몇 가지 추가 조사 후, 나는 실제로 System.Web.Optimization 및 대신 축약을 수행 내가보고하고있는 하나가 될 것으로 보인다 WebGrease 것을 발견했다. 이것은 나의 첫 번째 질문에 답하는 것 같지만, 나는 대체 minifier에 관한 조언을 여전히 고맙게 생각할 것이다.

Answer 1

과거에는 YUI Compressor의 Java에서 .NET 포트 인 YUI Compressor for .Net (현재 moved to GitHub)을 성공적으로 사용했습니다. Mozilla의 Rhino JavaScript 인터프리터를 기반으로합니다. 실제로는 코드를 이해하고 실제로 정규 표현식을 실행하는 것이 아닙니다. 따라서 JavaScript 구문 오류가있는 경우 빌드가 실패합니다.

Answer 2

Bundle Transformer (https://bundletransformer.codeplex.com/)가 잘 작동하는 것을 발견했습니다.

public class MvcApplication : System.Web.HttpApplication 
{ 
    protected void Application_Start() 
    { 
     var yuiMinifier = new BundleTransformer.Yui.Minifiers.YuiJsMinifier(); 
     var customerTransformer = new BundleTransformer.Core.Transformers.ScriptTransformer(yuiMinifier); 

     var customBundle = new BundleTransformer.Core.Bundles.CustomScriptBundle("~/js/my-javascript.min.js"); 
     customBundle.Include("~/js/script1.js"); 
     customBundle.Include("~/js/script2.js"); 
     customBundle.Transforms.Clear(); 
     customBundle.Transforms.Add(customerTransformer); 

     BundleTable.Bundles.Add(customBundle); 
    } 
} 

참고 : 다음 축약 만 디버그 경우 발생 내게는 등 YUI, JSMin을, 마이크로 소프트 아약스 Minifier, Global.asax.cs에서

예제 코드로 minifier 옵션을 가지고 있습니다 mode는 web.config에서 false로 설정되었습니다.