Typescript錯誤運行時錯誤：無法讀取擴展時未定義的屬性'原型'

Question

所以我在控制檯中得到上述錯誤。這是由於_super在傳遞到__extends（在生成的.js中）時未被定義。

下面是一些測試代碼可用於重現錯誤：

//This is the entirety of the file Test.ts 
module Test { 
    export class Test1 { 
     public Name: string; 
     public Number: number; 

     constructor() { 

     } 
    } 
} 

然後，在一個單獨的文件我已經從一個繼承的類：

/// <reference path="Test.ts" /> 
module Test { 
    export class Test2 extends Test1 { 
     constructor() { 
      super(); 
     } 
    } 
} 

的<reference path...不該」不需要（而不是），但我添加了它，看看它是否有幫助（它沒有）。

這些文件包含在正確的順序（Test.ts然後Test2.ts）通過BundleConfig（運行有或沒有優化沒有任何影響）。

我可能是一個巨型noob，但我沒有絲毫的線索，我已經搞砸了。我在網上找到的這個問題的所有其他實例都來自使用命令行編譯器將多個Typescript文件合併爲一個文件的人。我正在使用捆綁軟件來做到這一點，但即使我沒有合併它們，我也會遇到完全相同的問題。

請幫助我，我在我的智慧結束！

按照要求，這裏的編譯的JavaScript： Test.js：

//This is the entirety of the file Test.ts 
var Test; 
(function (Test) { 
    var Test1 = (function() { 
     function Test1() { 
     } 
     return Test1; 
    })(); 
    Test.Test1 = Test1; 
})(Test || (Test = {})); 
//# sourceMappingURL=Test.js.map 

Test2.js：

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 __(); 
}; 
/// <reference path="Test.ts" /> 
var Test; 
(function (Test) { 
    var Test2 = (function (_super) { 
     __extends(Test2, _super); 
     function Test2() { 
      _super.call(this); 
     } 
     return Test2; 
    })(Test.Test1); 
    Test.Test2 = Test2; 
})(Test || (Test = {})); 
//# sourceMappingURL=Test2.js.map 

Answer 1

可能的原因發生這種情況：

1. 四檢查BundleConfig按照正確的順序連接文件。這是迄今爲止該錯誤最常見的原因。
2. 確認您在Test.ts中沒有任何頂級export指令。這會導致文件成爲外部模塊，並且Test1將不再可見。

如果失敗了，您應該將發射的JavaScript發佈到問題中，以便我們可以診斷導致問題的原因。

Answer 2

今天發生此錯誤。不知道什麼是OP場景，但在我的團隊的情況下，我們有：

1. TypeScript v1.8。10
2. 基於的WebPack-發展建立與級聯，源地圖，沒有優化/醜化
3. 角2依賴注入
4. 鹼和在同一文件中定義的派生類（比如，dependencies.ts）
5. 基類中定義派生類後
6. 沒有編譯錯誤，也沒有警告顯示Uncaught TypeError: Cannot read property 'prototype' of undefined
7. 呼叫STAC
8. 控制檯日誌ķ在另一個類中的最後一行內部__extends功能指向，在另一個文件（比如client.ts），導入那些作爲依賴

在代碼：

// dependencies.ts 

import { Injectable } from 'angular2/core'; 

@Injectable() 
export class LocalStorageService extends BaseStorageService { 
    constructor() { 
    super(localStorage); 
    } 
} 

class BaseStorageService { 
    constructor(private storage: Storage) {} 
    // ... 
} 

和：

// client.ts 

import { Injectable } from 'angular2/core'; 
import { LocalStorageService } from './dependencies'; 

@Injectable() 
export class AuthStorageService { 

    constructor(private permanentStorage: LocalStorageService) { } 
    // ... 

} // <-- call stack pointed here with inner '__extends' function 

通過在派生類之前定義基類解決了問題。經過快速搜索&閱讀後，這似乎與已知的（和未解決的？）TypeScript問題有關，例如， #21和#1842。

HTH

Answer 3

HTML上的腳本順序很重要。

假設你有一個打字稿文件A.ts定義一個抽象類 和帶類，它擴展在A.ts抽象類

出口抽象類ShipmentsListScope實現IShipmentsListScope {

A.ts文件B.ts：

module app.example{ 
    "use strict"; 

    interface IMyInterface{ 
    // .. 
    } 
    export abstract class MyAbstract implements IMyInterface{ 
    // .. 
    } 
} 

B.ts

module app.example{ 
    "use strict"; 

    class MyChildClass extends MyAbstract { 
    // ... 
    } 
} 

然後在你的HTML，你必須確保一旦Java腳本已生成腳本的順序是正確的：

<script src="/app/example/A.js"></script> <!-- A.js BEFORE --> 
<script src="/app/example/B.js"></script> 

Answer 4

徒留我在這裏是如何解決這個問題，我的情況：我錯過了參考在TS文件的頂部，它對於構建完全沒問題，而我在運行時有相同的錯誤。添加似乎是可選的參考解決了我的運行時問題。

Answer 5

我有同樣的問題，它是由export default陳述造成的。爲了解決這個問題，我只是去掉那些與進口所需物品的另一種方式：

前

A.TS

export default MyClass; 

class MyClass { ... } 

B.ts

import MyClass from "./A"; 

class MyClass2 extends MyClass { ... } 

AFTER

A.ts

export class MyClass { ... } 

個B.ts

import { MyClass } from "./A"; 

class MyClass2 extends MyClass { ... }