奇怪的打字稿/ angular2导入行为

Question

我试图为另一个SO问题创建一个演示,首先是angular-cli,然后是punker.

我import在两个版本之间遇到了奇怪的行为差异.

问题import出现在以下代码中的第二个:

moment.service.ts

import { Injectable } from '@angular/core';

// Following work in plunker setup
import m from 'moment';
// Following work in angular-cli setup
//import * as m from 'moment';

@Injectable()
export class MomentService {
  moment = m;
}

在angular-cli代码中,我必须使用:

import * as m from 'moment';

如果我使用punker设置,无论是在punker中还是在运行本地服务器,我必须关注或者它不会在浏览器中运行:

import m from 'moment';

任何人都可以解释行为的差异？

Plunker:链接

Github:plunker代码本地版本(包括一个本地服务的server.js)

Github:angular-cli版本

Answer 1

TL:DR每个演示都使用不同的模块格式.在plunker中,整个模块被视为默认导出.在cli项目中,没有默认导出.

每个演示都使用不同的模块格式.plunker没有指定格式,我不确定systemjs默认使用什么格式,但我不相信它是ES6.CLI项目使用ES6模块格式.

如果您查看此处,您将看到模块格式何时为AMD,commonjs或global,它将导出整个模块作为默认导出.ES6模块不会发生这种情况,您需要明确定义默认导出,而momentjs则不需要.

因此,在plunker演示中,可行,import m from 'moment'因为您的配置告诉systemjs和typescript将整个模块视为默认导出(如果没有).由于CLI项目中的配置,模块不会被视为默认导出,因此您必须使用import * as m from 'moment'从名称空间"m"下方导入所有命名导出的内容.

这是关于TypeScript的repo的讨论