【茶包射手日記】TypeScript JS檔打包壓縮時發生錯誤

前陣子專案的TypeScript更新成1.4，今天上線時發現網站出現JavaScript錯誤，由錯誤訊息推測為打包壓縮程序有誤：第一個foo.js的最後一列 //# sourceMappingURL=foo.js.map 跟第二個bar.js的第一列;var __extends = this.__extends || function (d, b) { 被合併成一列，由於開頭有//符號，整列被註解掉，bar.js的第一列被吃掉以致程式碼不全出錯：

/* Minification failed. Returning unminified contents.

(12,1-2): run-time warning JS1002: Syntax error: }

 */

var models;

(function (models) {

function foo() {

    }

    models.foo = foo;

})(models || (models = {}));

//# sourceMappingURL=foo.js.map;var __extends = this.__extends || function (d, b) {

for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];

function __() { this.constructor = d; }

    __.prototype = b.prototype;

    d.prototype = new __();

};

var models;

(function (models) {

varbase = (function () {

functionbase() {

        }

returnbase;

    })();

var bar = (function (_super) {

        __extends(bar, _super);

function bar() {

            _super.apply(this, arguments);

        }

return bar;

    })(base);

})(models || (models = {}));

//# sourceMappingURL=bar.js.map;

同樣的程式碼及打包壓縮程序在升級TypeScript 1.4前運作正常，讓人合理懷疑是1.4版調整輸出JavaScript格式導致。找到尚未升級TypeScript 1.4的VS2013，比對TypeScript的編譯結果，果真找到差異。下圖左方檔案來自1.3版，右方則是1.4版，可以看到1.3版在//# sourceMappingURL=foo.js.map後原本還有一列空白（共9列），1.4時被移除了（只有8列）。

1.4版的//# sourceMappingURL=foo.js.map後方少了換行符號及空白列，ScriptBundle又直接串接foo.js與bar.js，因而釀成慘劇。但是，TypeScript改版導致打包壓縮出錯，理應哀鴻遍野才對，但網路未見相關討論，莫非與ScriptBundle版本有關？

檢查有問題的ASP.NET 4專案，System.Web.Optimization.dll為1.0.0版。另外新建一個ASP.NET 4.5，放入相同TypeScript並用ScriptBundle打包，結果正常：

檢查ASP.NET 4.5的System.Web.Optimization.dll為1.1.0，由此推論問題與System.Web.Optimization版本有關。而原本的MVC4專案，在使用NuGet將System.Web.Optimization由1.0.0升級到1.1.0後，JavaScript錯誤消失無蹤，證實確為ScriptBundle版本問題！

結論：專案升級TypeScript 1.4後，System.Web.Optimization請升級到1.1.0+，以免打包壓縮出錯。