我爲TypeScript正確配置了JSPM嗎？

與SPA的ASP.NET核心剃刀網頁應用程序有

default.html中

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>JSPM</title> 
 
    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1"> 
 
</head> 
 
<body aurelia-app> 
 
    <script src="packages/system.js"></script> 
 
    <script src="jspm.config.js"></script> 
 
    <script src="jspm.dev.js"></script> 
 
    <script > 
 
     System.import('xperiandri/app.ts'); 
 
    </script> 
 
    <!--<script> 
 
     SystemJS.import('aurelia-bootstrapper'); 
 
    </script>--> 
 
</body> 
 
</html>

jspm.config.js

SystemJS.config({ 
 
    paths: { 
 
    "github:": "packages/github/", 
 
    "npm:": "packages/npm/" 
 
    }, 
 
    browserConfig: { 
 
    "baseURL": "/", 
 
    "paths": { 
 
     "xperiandri/": "/" 
 
    } 
 
    }, 
 
    nodeConfig: { 
 
    "paths": { 
 
     "xperiandri/": "" 
 
    } 
 
    }, 
 
    transpiler: "plugin-typescript", 
 
    typescriptOptions: { 
 
    "module": "system", 
 
    "target": "es6", 
 
    "tsconfig": false, 
 
    "sourceMap": true 
 
    }, 
 
    packages: { 
 
    "xperiandri": { 
 
     "main": "app.ts", 
 
     "defaultExtension": "ts", 
 
     "meta": { 
 
     "*.ts": { 
 
      "loader": "plugin-typescript" 
 
     } 
 
     } 
 
    } 
 
    } 
 
});

app.ts

export class App { 
 
    constructor() { 
 
     console.log("JSPM initialized"); 
 

 
     var textnode = document.createTextNode("Welcome JSPM!"); 
 
     document.body.appendChild(textnode); 
 
    } 
 
}

我希望看到標籤與Welcome JSPM!文本添加到身體，但這種情況不會發生。我做錯了什麼？

app.ts由Microsoft Edge下載，簽入開發人員工具。但其媒體類型是視頻，而不是文本。

請求

Accept: application/x-es-module, */* Accept-Encoding: gzip, deflate Accept-Language: uk, ru; q=0.8, en-US; q=0.5, en; q=0.3 Connection: Keep-Alive Host: localhost:41467 Referer: http://localhost:41467/ User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16275

響應

Accept-Ranges: bytes Content-Type: video/vnd.dlna.mpeg-tts Date: Sun, 27 Aug 2017 22:01:34 GMT ETag: "1d31766378d8152:-1" Last-Modified: Thu, 17 Aug 2017 14:36:31 GMT Server: Kestrel Transfer-Encoding: chunked X-Powered-By: ASP.NET X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNc0JDQvdC00YDRltC5XERldlxYcGVyaUFuZHJpXEx5c292Lk1uZ1xzcmNcV2ViXGFwcC50cw==?=

來源

2017-08-27 Andrii

如果文件被下載就意味着MIME類型是錯誤的。

您需要添加MIME類型ts文件text/x.typescript或text/prs.typescript

嘗試在啓動配置添加此

var fileProvider= new FileExtensionContentTypeProvider(); 
fileProvider.Mappings.Add(".ts", "text/x.typescript"); 

app.UseStaticFiles(new StaticFileOptions() { ContentTypeProvider = fileProvider});

來源

2017-08-28 00:32:21

幾乎工作 Layload現在正確的，但有編碼問題 '''我»¿導出類應用程序構造函數（）{ console.log（「JSPM initialized」）; var textnode = document.createTextNode（「Welcome JSPM！」）; document.body.appendChild（textnode）; } }''' – Andrii

它必須替換'fileProvider.Mappings [「。ts」] =「text/x.typescript」;'因爲這個擴展名已經註冊了 – Andrii

試着強制utf 8編碼 –

我爲TypeScript正確配置了JSPM嗎？

回答

相關問題