如何使用打字稿和ASP.Net核心

少數html頁面中使用vuejs 2我有一個ASP.Net核心MVC與剃鬚刀視圖，使用VueJs2時，它需要更復雜。如何使用打字稿和ASP.Net核心

我想每個視圖都有一個js文件。

我的文件夾結構是這樣的：

├ Controllers\HomeController.cs (with actions Index & Details) 
├ Scripts\Home\index.ts 
├ Scripts\Home\details.ts 
├ Views\Home\Index.cshtml 
├ Views\Home\Details.csthml 
├ wwwroot\lib\vue 
├ wwwroot\js\Home\index.js (generated with typescript) 
├ wwwroot\js\Home\details.js (generated with typescript) 
├ tsconfig.json

這裏是我的tsconfig.json

{ 
    "compilerOptions": { 
    "noImplicitAny": false, 
    "noEmitOnError": true, 
    "removeComments": false, 
    "sourceMap": true, 
    "target": "es5", 
    "outDir": "wwwroot/js", 
    "rootDir": "Scripts", 
    "allowSyntheticDefaultImports": true, 
    "lib": [ 
     "dom", 
     "es5", 
     "es2015.promise" 
    ] 
    }, 
    "include": [ 
    "wwwroot/lib/vue/typings", 
    "Scripts" 
    ], 
    "compileOnSave": true 
}

我index.ts文件

import Vue from 'vue' 

var app = new Vue({ 
    el: '#app', 
    data: { 
     message: 'Hello Vue!' 
    } 
})

而生成的文件：

"use strict"; 
var vue_1 = require("vue"); 
var app = new vue_1.default({ 
    el: '#app', 
    data: { 
     message: 'Hello Vue!' 
    } 
}); 
//# sourceMappingURL=index.js.map

在我的Index.cshtml中我加載了js文件，但是我有這個需要的指令在我的瀏覽器中不起作用。

如何讓這個js文件在瀏覽器中工作？

來源

2017-04-13 Swell

」有這種需求指令，在我的瀏覽器中不起作用。「 - 你會得到什麼錯誤？ –

注意，在你的tsconfig.json，因爲你沒有指定"module"設置，它默認爲"commonjs"，指定此或其他值（見下文）明確。

這裏的問題是，瀏覽器還沒有廣泛支持模塊。那些確實有不完整的初步支持。爲了在瀏覽器中使用模塊，您需要一個加載器或一個打包器。

固體選項包括SystemJS（可選用jspm），RequireJS，Webpack或Browserify。

一些注意事項：

在你tsconfig.json的"compilerOptions"

設置"module": "system"如果你SystemJS去。

設置"module": "amd"並刪除"allowSyntheticDefaultImports"如果您使用RequireJS。

設置"module": "commonjs"如果你使用Webpack。

設置"module": "commonjs"並刪除"allowSyntheticDefaultImports"如果您使用Browserify。「

來源

2017-04-21 06:55:28

如何使用打字稿和ASP.Net核心

回答

相關問題