System.jsでTypescriptでコンパイルされたモジュールをインポートするときのエラー

最近、Typescriptでコンパイルされたモジュールをインポートするためにsystem.jsを使用する方法を学んでいます。モジュールは以前require.js用にコンパイルされていて、うまく動作します。System.jsでTypescriptでコンパイルされたモジュールをインポートするときのエラー

ただし、system.jsにマージするときは、system-production.jsを適用するとモジュールをインポートできません。コンソールには、

Uncaught (in promise) Error: Module instantiation did not call an anonymous or correctly named System.register. 
    Instantiating https://www.star.com/libs/js/klondike.js 
    Loading ./libs/js/klondike.js 
    at register-loader.js:203 
t   @ common.js:83 
(anonymous) @ loader-polyfill.js:70

と表示されています。エラーメッセージの原因はよくわかりません。 system.src.jsを適用すると、エラーメッセージは表示されませんが、インポートされたモジュールでは関数を使用できません。すべての呼び出しは未定義を返します。それで私は間違った方法で操作したのですか？

以下はソースコードです。

test.htmlという

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 
</head> 
<body> 
</body> 

<!-- sys import --> 
<script src="libs/js/system-production.js"></script> 

<!--<script src="libs/js/system.src.js"></script>--> 

<script> 
    System.import("./libs/js/klondike.js"); 
</script> 

</html>

tsconfig.json

{ 
    "compilerOptions": { 
    "module": "System", 
    "outFile": "../../js/klondike.js", 
    "target": "es5", 
    "sourceMap": true, 
    "removeComments": true 
    }, 
    "include": [ 
    "./*" 
    ] 
}

メインモジュール：CardMoves.ts

//sys import 
import * as DBJSN from "./debugJson"; 
import PokerCard from "./Cards"; 

let suits: string[] = ["spade", "heart", "club", "diamond"]; 
let cards: string[] = [, "A", "2", "3", "4", "5", "6", "7", "8", "9", "10", "J", "Q", "K"]; 

//sys export 
export function createDeck() { 
    let playCards: PokerCard[] = new Array(DBJSN.settings.decks*52); 

    console.log(playCards); 

    for (let i=0; i<playCards.length; i++) { 
     playCards[i] = new PokerCard(); 
     playCards[i].suit = suits[Math.floor(i % 52/13)]; 
     playCards[i].card = i % 52 % 13 + 1; 
    } 

    return playCards; 
}

Dependency1：Cards.ts

//sys export 
export default class PokerCard { 
    private _suit: string; 
    private _card: number; 

    constructor() {} 

    //Suit getter and setter 
    get suit(): string { 
     return this._suit; 
    } 

    set suit(newSuit: string) { 
     try { 
      if (this._suit === undefined) 
       this._suit = newSuit; 
      else 
       throw "Suit value has been set."; 
     } 
     catch(e) { 
      console.log(e); 
     } 
    } 

    //Card getter and setter 
    get card(): number { 
     return this._card; 
    } 

    set card(newCard: number) { 
     try { 
      if (this._card === undefined) 
       this._card = newCard; 
      else 
       throw "Card value has been set."; 
     } 
     catch(e) { 
      console.log(e); 
     } 
    } 
}

Dependency2：debugJson.ts

//sys export 
export let settings = { 
    decks: 1, 
    cardsPerClick: 1, 
    timer: true 
};

出典

2017-02-05 Liranius

私は同じ問題がありました。問題は、通常のモジュールとしてバンドルを使用しようとしたことです。ドキュメントによると、バンドルにはいくつかのSystem.register呼び出しが必要です。次に、このバンドルをscriptタグ経由で通常のjsファイルとして追加する必要があります。そして、あなたの開始点モジュール（あなたの場合は私が前提とするcreateDeck）を呼び出した後。

詳細については、https://github.com/systemjs/systemjs/blob/master/docs/production-workflows.mdに従ってください。

希望すると便利です。

出典

2017-03-18 01:00:58 Gregory

この問題は解決しましたか？私はまったく同じ問題を抱えています。このドキュメントでは、Typescriptコンパイラを使用してバンドルされたjsファイルを使用する方法が非常に不明です。 – Kokodoko

スクリプトタグを使ってバンドルを組み込むことは、私のためにやってくれました。 –

System.jsでTypescriptでコンパイルされたモジュールをインポートするときのエラー

答えて

関連する問題