CODEWITHSUNDEEP
javascripttypescript
mariocatch
mariocatch

Reputation: 8703

Basic Typescript app issue with importing and exporting

I have a very basic Typescript app and Chrome is complaining about the following when opening my index.html page:

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);
    }
}

I'm using Visual Studio code and have the following:

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"
}

Upvotes: 0

Views: 55

Answers (1)

basarat
basarat

Reputation: 276353

from your errors : 

exports is not defined

import is not defined

You need a module loader! Browsers don't natively understand modules yet. Recommend using webpack (other options include browserify etc.).

More

Quickstart: https://basarat.gitbook.io/typescript/content/docs/quick/browser.html

Upvotes: 1

Related Questions