使用Visual Studio 2017將Typescript轉換為ES5-導出未定義

Question

我正在嘗試使用Visual Studio 2017將Typescript集成到現有的ASP.NET MVC項目中。 雖然我理解人們通常可以使用任務亞軍和/或捆扎機等的WebPack到transpile“更新” JS到ES5，根據這篇文章 ，它看起來好像Visual Studio的2017年應該處理transpiling你。

但是，在瀏覽器中運行網站時，出現以下錯誤：

ReferenceError: exports is not defined[Learn More]

我當前的.tsconfig如下：

  {
  "compileOnSave": true,

  "compilerOptions": {
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "module": "commonjs",
    "outDir": "./Scripts/out/",
    "rootDir": "./Scripts/src"
  },
  "exclude": [
    "node_modules",
    "wwwroot",
    "outDir",
    "./Scripts/out/"
  ],
  "lib": [
    "es2016",
    "dom",
    "es5"
  ]

}

我嘗試刪除"module": "commonjs"行，並按此處所述添加es5 lib，但收到相同的錯誤。

App-slider是我編寫的模塊； hyperform是通過npm安裝的。 兩者都是默認導出。

 import hyperform from "hyperform";
import AppSlider from "./app-slider";
let appSlider = new AppSlider(null);
let $hyperForm = hyperform("window");
let form: HTMLFormElement  = document.getElementsByTagName("form")[0];
let prevButton: HTMLButtonElement = <HTMLButtonElement>document.getElementById("prev");
let nextButton: HTMLButtonElement = <HTMLButtonElement>document.getElementById("next");

prevButton.addEventListener("click", (e) => {
        appSlider.showPrev();
});

nextButton.addEventListener("click", (e) => {
    e.preventDefault();
    if (form.checkValidity()) {
        appSlider.showNext();
    }
});

生成的main.js

   "use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var hyperform_1 = require("hyperform");
var app_slider_1 = require("./app-slider");
var appSlider = new app_slider_1.default(null);
var $hyperForm = hyperform_1.default("window");
var form = document.getElementsByTagName("form")[0];
var prevButton = document.getElementById("prev");
var nextButton = document.getElementById("next");
prevButton.addEventListener("click", function (e) {
    appSlider.showPrev();
});
nextButton.addEventListener("click", function (e) {
    e.preventDefault();
    if (form.checkValidity()) {
        appSlider.showNext();
    }
});
//# sourceMappingURL=main.js.map

如果將“模塊”選項更改為es6，則會收到其他錯誤：

SyntaxError: import declarations may only appear at top level of a module

我正在使用TypeScript 2.5。 任何意見，將不勝感激。 謝謝。

Answer 1

看起來您的.tsconfig文件未得到解析-您可以將其重命名為tsconfig.json嗎？