如何修復VS2015上的Angular2/TypeScript ASP.NET 4.6.1的404路徑錯誤

我想在VS2015上使用TypeScript，Angular2和ASP.NET 4.6.1構建一個新的應用程序。我遇到兩個問題。如何修復VS2015上的Angular2/TypeScript ASP.NET 4.6.1的404路徑錯誤

第一條：我在我的index.html文件中的包含文件上收到404錯誤。當我在Chrome中打開F12開發人員工具，我看到這一點：

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

正如你所看到的，它試圖去應用程序/應用/，但我的文件在應用程序/ lib目錄/。這是爲什麼發生？ 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" 
    ] 
}

這究竟是爲什麼？我需要做些什麼才能正確地獲得此設置？

來源

2016-03-31 Chris Holmes

好吧，我想我明白了原因。

您的index.html正在/app/index.html

所以所有的腳本導入相對於這個的index.html文件所在的目錄

例如：

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

它表示「/app/app/lib/es6-shim.min.js」。這是不存在的，所以你得到一個404

簡單的改變：

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

和其他人。它會解決問題。

來源

2016-03-31 06:22:58

添加修復它。正如你所建議的，我試圖改變包含的src，但我仍然留下了系統未定義的錯誤。將base href添加到我的index.html頂部修復了整個事情。 –

如何修復VS2015上的Angular2/TypeScript ASP.NET 4.6.1的404路徑錯誤

回答

相關問題