簡體   English   中英

Closure編譯器導出Typescript類和函數

[英]Closure compiler export Typescript classes and functions

我試圖在typescript生成的類上使用閉包編譯器高級模式,但沒有成功。 有誰做過這樣的事情。

打字稿類

class TestData {
BlogName: string;
CacheTimeOut: number;
CopyrightHolder: string;

constructor(blogName: string, cacheTimeOut: number, copyrightHolder: string) {
    this.BlogName = blogName;
    this.CacheTimeOut = cacheTimeOut;
    this.CopyrightHolder = copyrightHolder;
}

addBlog(value: string): boolean {
    console.log('add blog');
    return true;
}

validate(): boolean {
    console.log('all valid');
    return true
}       
}

var myTestData = new TestData("name",22,"cpyright");

生成的代碼

var TestData = (function () {
function TestData(blogName, cacheTimeOut, copyrightHolder) {
    this.BlogName = blogName;
    this.CacheTimeOut = cacheTimeOut;
    this.CopyrightHolder = copyrightHolder;
}
TestData.prototype.addBlog = function (value) {
    console.log('add blog');
    return true;
};
TestData.prototype.validate = function () {
    console.log('all valid');
    return true;
};
return TestData;

})();var myTestData = new TestData();

這編譯成

new function() {};

我知道我應該提供出口,所以我補充道

window['TestData'] = TestData;
window['TestData'].prototype['addBlog'] = TestData.prototype.addBlog
window['TestData'].prototype['validate'] = TestData.prototype.validate

我從閉包編譯器高級編譯的輸出是

var a = function() {
  function b() {
  }
  b.prototype.a = function() {
    console.log("add blog");
    return !0;
  };
  b.prototype.b = function() {
    console.log("all valid");
    return !0;
  };
  return b;
}();
window.TestData = a;
window.TestData.prototype.addBlog = a.prototype.a;
window.TestData.prototype.validate = a.prototype.b;
new a;

如果你看到仍然沒有剩下的構造函數代碼。 當我們在模塊中添加它時,這會變得更糟。

我也嘗試使用谷歌關閉的@export沒有成功

谷歌推薦

我看到幾個插件可以根據typescript生成閉包編譯器注釋,但那些也沒有生成正確的代碼。

第三方閉包注釋生成器

我對此進行了非常基本的測試。 也許您更改了代碼並且沒有重新嘗試過。

如果您在問題中編譯TypeScript,則應該生成以下JavaScript:

var TestData = (function () {
    function TestData(blogName, cacheTimeOut, copyrightHolder) {
        this.BlogName = blogName;
        this.CacheTimeOut = cacheTimeOut;
        this.CopyrightHolder = copyrightHolder;
    }
    TestData.prototype.addBlog = function (value) {
        console.log('add blog');
        return true;
    };
    TestData.prototype.validate = function () {
        console.log('all valid');
        return true;
    };
    return TestData;
})();
var myTestData = new TestData("name", 22, "cpyright");

特別是,最后一行將參數傳遞給TestData構造函數。

使用@compilation_level SIMPLE_OPTIMIZATIONS快速運行(白色空間是我的):

var TestData=function(){
    function a(a,b,c){
        this.BlogName=a;this.CacheTimeOut=b;this.CopyrightHolder=c
    }
    a.prototype.addBlog=function(a){console.log("add blog");return!0};
    a.prototype.validate=function(){
        console.log("all valid");return!0
    };
    return a
}(),myTestData=new TestData("name",22,"cpyright");

如果對部分代碼使用高級優化,則會過於激進。 您需要為Closure編譯器提供所有代碼,以了解實際未使用的內容。

如果您的示例代表您的所有代碼,您會注意到構造函數以及所有三個屬性(BlogName,CacheTimeOut和CopyrightHolder)確實從未使用過,因此可以在不影響程序行為的情況下將其刪除。

答案:優化的noops是 - 等待它 - noops :)

說明:

如果您在http://www.closure-compiler.appspot.com/home使用您的生成代碼和ADVANCED_OPTIMIZATIONS,它會產生:

new function(){};

如果你添加myTestData.addBlog("test"); 它產生:

(new (function(){function a(){}a.prototype.a=function(){console.log("add blog")};return a}())).a();

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM