导入/导出模块-打字稿

Question

当我尝试导入外部模块并尝试编译我的代码时，出现以下错误消息： app.ts:1 Uncaught ReferenceError: require is not defined at app.ts:1 。 打字稿的版本是：2.1.6。

我的app.ts文件：

import {PI, calcCircumference } from "./math/circle";

console.log(PI);
console.log(calcCircumference(10));
//console.log();

我的circle.ts文件

export const PI: number = 3.14;

export function calcCircumference(diameter: number) {

    return diameter * PI;
};

我的tsconfig.json文件

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

谢谢大家

Answer 1

我假设您正在尝试在客户端环境-浏览器中运行代码。 在这种情况下，您必须配置模块加载器，因为与诸如node.js之类的服务器环境不同，浏览器默认还不支持模块加载，并且不知道如何“要求”特定模块。

您在这里有几种选择：

1. 捆绑工具，如browserify / 的WebPack
2. 像requirejs / systemjs这样的装载程序

Google，您会发现很多有关如何使用上述方法之一设置打字稿的教程（例如： systemjs ， webpack ）

我个人的偏好是systemjs（以jspm作为包管理器）-但是您的选择将在很大程度上取决于您所构建的应用程序的特定要求。