2016-03-31 5 views
0

VS2015でTypeScript、Angular2、およびASP.NET 4.6.1を使用して新しいアプリケーションを作成しようとしています。私は2つの問題を経験しています。Angular2/TypeScript ASP.NET 4.6.1の404パスエラーをVS2015で修正する方法

最初に: index.htmlファイルのインクルードファイルに404エラーが表示されます。あなたが見ることができるように

GET http://localhost:58613/app/app/lib/es6-shim.min.js 

アプリ/アプリ/に行くことにしようとしているが、私のファイルは、アプリ/ libに/である:私はChromeでF12の開発ツールを開くと、私はこれを参照してください。なぜこうなった? Chromeはこのすべてについて404エラーを報告します。しかし、私の.cssファイル(このポストに掲載されているindex.htmlファイル)は404エラーを報告しません。

第二:私はアプリを実行すると、それはIEで開きます(バージョン10、私のデフォルトのブラウザ)私はこのエラーを参照してください。

0x800a1391 - JavaScriptのランタイムエラー: 'システム' は

定義されていませんそれは、このコードを打つ時:

System.config({ 
     packages: { 
     app: { 
      //format: 'register', 
      defaultExtension: 'js' 
     } 
     } 
    }); 

私のディレクトリ構造は、次のとおりです。

/app/ 
    index.html 
    --Main/ 
     boot.ts 
     boot.js 
    --lib/ 
     various .js files moved via gulp 
    --Components 

私のindex.htmlファイルには、次のとおりです。

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <link href="lib/bootstrap.min.css" rel="stylesheet"> 

    <!-- Toastr--> 
    <link href="lib/toastr.min.css" rel="stylesheet" /> 
</head> 
<body> 
    <script src="lib/jquery.min.js"></script> 
    <script src="lib/bootstrap.min.js"></script> 
    <script src="lib/toastr.min.js"></script> 

    <script src="app/lib/es6-shim.min.js"></script> 
    <script src="app/lib/shims_for_IE.js"></script> 
    <script src="app/lib/system-polyfills.src.js"></script> 

    <script src="app/lib/angular2-polyfills.min.js"></script> 
    <script src="app/lib/system.src.js"></script> 
    <script src="app/lib/rx.min.js"></script> 
    <script src="app/lib/angular2.dev.js"></script> 
    <script src="app/lib/router.dev.js"></script> 
    <script src="app/lib/http.dev.js"></script> 


    <script> 
    System.config({ 
     packages: { 
     app: { 
      //format: 'register', 
      defaultExtension: 'js' 
     } 
     } 
    }); 
    System.import('app/Main/boot') 
      .then(null, console.error.bind(console)); 

    </script> 

    <my-app>Hello World</my-app> 
</body> 
</html> 

tsconfig.jscon

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false 
    }, 
    "exclude": [ 
    "node_modules", 
    "typings/main", 
    "typings/main.d.ts" 
    ] 
} 

ですが、なぜでしょうか?この設定を正しく行うためには何が必要ですか?

答えて

0

私は原因が分かると思います。

あなたのindex.htmlが/app/index.html

ので、すべてのスクリプトのインポートがこののindex.htmlファイルが入っていることをディレクトリからの相対下にある例えば

:。

<script src="app/lib/es6-shim.min.js"></script> 

「/app/app/lib/es6-shim.min.js」を意味します。

<script src="lib/es6-shim.min.js"></script> 

と同様に他の人のために:あなたは404〜

簡単な変更にそれを得るためには、ありません。問題を解決します。

+0

を追加しました。あなたが提案したようにインクルードのsrcを変更しようとしましたが、私はまだSystem undefinedエラーが残っていました。私のindex.htmlの上にベースhrefを追加することですべてが修正されました。 –

関連する問題