javascript - Typescript 应用程序导入和导出的基本问题

Question

我有一个非常基本的 Typescript 应用程序，Chrome 在打开我的 index.html 页面时提示以下内容:

exports is not defined

import is not defined

app.ts

import Timer from "./models/timer";

class Startup {
    public static main() {
        // Initialize timer
        var timer = new Timer(new Date("25/12/2015 00:00:00"));
        // Start timer
        timer.start();
    }
}

Startup.main();

models/timer.ts

export default class Timer {
    target: Date;
    days: number;
    hours: number;
    minutes: number;
    seconds: number;
    constructor(target: Date) {
        this.target = target;
    }

    start() {
        var now = Date.now;
        alert(now);
    }
}

我正在使用 Visual Studio 代码并具有以下内容:

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "sourceMap": true
    }
}

tasks.json

{
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": ["-p", "."],
    "showOutput": "silent",
    "problemMatcher": "$tsc"
}

Answer 1

从你的错误中:

exports is not defined

import is not defined

您需要一个模块加载器!浏览器本身还不能理解模块。推荐使用 webpack (其他选项包括 browserify 等)。

更多

快速入门:https://basarat.gitbook.io/typescript/content/docs/quick/browser.html