在TypeScript中导入模块不起作用

时间:2016-12-30 10:54:17

标签: javascript typescript systemjs

我有2个打字稿文件, 第一个app.ts文件输入点 和第二个mobiles.ts文件模块包含接口和类 模块系统CommonJS,设置ECMAScript版本ES5。

当我运行app时,在浏览器中获取错误

  

ReferenceError:未定义require       在app.js:2

文件mobiles.ts

的内容
export interface Device {
    model: string;
    company: string;
    displayInfo(): void;
}

export class Smartphone implements Device {
    model: string;
    company: string;

    displayInfo(): void {
        console.log(`Smartphone. Model: ${this.model} - Company: ${this.company}`);
    }
}

export class Tablet implements Device {
    model: string;
    company: string;

    displayInfo(): void {
        console.log(`Tablet. Model: ${this.model} - Company: ${this.company}`);
    }
}

文件内容app.ts

import {Smartphone} from "./mobiles";

window.onload = () => {
    let mi: Smartphone = new Smartphone();
    mi.company = "Xiaomi";
    mi.model = "RedMi 4 Pro";
    mi.displayInfo();
};

在文件mobiles.js

的编译内容之后
"use strict";
var Smartphone = (function () {
    function Smartphone() {
    }
    Smartphone.prototype.displayInfo = function () {
        console.log("Smartphone. Model: " + this.model + " - Company: " + this.company);
    };
    return Smartphone;
}());
exports.Smartphone = Smartphone;
var Tablet = (function () {
    function Tablet() {
    }
    Tablet.prototype.displayInfo = function () {
        console.log("Tablet. Model: " + this.model + " - Company: " + this.company);
    };
    return Tablet;
}());
exports.Tablet = Tablet;
//# sourceMappingURL=mobiles.js.map

编辑app.js文件的内容

"use strict";
var mobiles_1 = require("./mobiles"); //Error Get here
window.onload = function () {
    var mi = new mobiles_1.Smartphone();
    mi.company = "Xiaomi";
    mi.model = "RedMi 4 Pro";
    mi.displayInfo();
};
//# sourceMappingURL=app.js.map

0 个答案:

没有答案