未捕获的 ReferenceError：未定义导出并且需要答案

【问题标题】：Uncaught ReferenceError: exports is not defined and require未捕获的 ReferenceError：未定义导出并且需要
【发布时间】：2016-04-26 01:04:27
【问题描述】：

我正在使用 angularjs 和 typescript 创建一些应用程序，我遇到了无法解决的错误问题

这是我的 *.ts 代码

export var NgApp = new application.Startup();

///<reference path="../../../../../typings/tsd.d.ts"/>
import {NgApp} from "../../bootstrap";



module views.components.home {
    export class HomeComponent {
        public constructor() {
        }

        public static factory():Function[] {
            return [
                () => new HomeComponent()
            ]
        }

    }

}

NgApp.registerComponents(views.components.home,() => this.app.controller);

这是我的 GULP 任务

let tsResult = gulp.src('src/**/*.ts').pipe(ts({
    module: 'commonjs',
    sourceMap: true
}));

let taskTs = tsResult.js.pipe(gulp.dest('built/'));

这是我的错误：未捕获的 ReferenceError：未定义导出

问题是：如何在打字稿中使用像 es6 这样的导入？我错过了什么？

【问题讨论】：

尝试用模块编译：“amd”
@Amid nope 它没有帮助
我假设您的网页上有指向 system.js 的链接。您也可以尝试使用 angular2 快速入门指南中所述的 module:system 进行编译。
我正在使用 angularjs 1.5
我没有尝试过 1.5。但是对于 1.4，我在主 html 页面上将“amd”作为模块 + 引用到 angular.js 等，它成功了。

标签： angularjs typescript gulp ecmascript-6

【解决方案1】：

我使用 Angular 1.6 和 webpack，当我将模块更改为 "umd"

时，它对我有用

UMD：通用模块定义支持两种样式（AMD 和 CommonJS）的“通用”模式

参考：http://davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/

这里粘贴的是我更改后的 tsconfig.json，我运行 $ tsc

{
  "compilerOptions": {
    "target": "es5",
    "module": "umd",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "allowUnreachableCode": true
  },
  "exclude": [
    "node_modules"
  ]
}

然后我的“exports is not defined”错误消失了。

【讨论】：

【解决方案2】：

click here“终于解决了”我也遇到了同样的错误，我将模块：“commonjs”更改为“模块”：“es6”，因为针对 ES5 删除了导入/导出语句，因此这些工具无法删除未使用的导出。

{
    "compilerOptions": {
    "target": "es5",
    "module": "es6",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
    }

}

【讨论】：

【解决方案3】：

如何在打字稿中使用像 es6 这样的导入？我错过了什么？

您需要使用模块加载器。这是一个使用 webpack 的示例：https://github.com/AngularClass/angular2-webpack-starter

【讨论】：

对不起，我使用 angularjs 1.5，实际上对 webpack 不太熟悉，我可以使用具有相同能力的 systemjs 来加载模块吗？
你可以。但它更前沿（对我来说没有必要，因为 webpack 已经完成了我需要的一切）