Angular2导入模块错误：TS2307 [重复]答案

【问题标题】：Angular2 import modules Error: TS2307 [duplicate]Angular2导入模块错误：TS2307 [重复]
【发布时间】：2016-05-18 16:53:29
【问题描述】：

我将用angular2和systemjs编写一个简单的hello word应用程序来在phpStorm中导入模块。

这是我项目的目录：

ProjectName
     |--app
        |--app.ts
        |--app.js
     |node_modules
     |index.html
     |package.json
     |tsconfig.json

这是一段代码：

import { bootstrap } from "angular2/platform/browser";
import { Component } from "angular2/core";

问题：
它怎么知道在哪里可以找到这个文件？当我将 node_modules 移动到 app 文件夹时，出现了错误。

【问题讨论】：

标签： typescript angular systemjs

【解决方案1】：

这有点令人困惑：angular2/platform/browser 和 angular2/core 是模块的名称，而不是文件的名称。这些模块从主 Angular2 脚本加载，可以是 node_modules/angular2/angular2.min.js 或 node_modules/angular2/angular2.dev.js。

如果您的代码可以访问 angular2.js，则可以导入许多不同的 Angular 模块。

【讨论】：

【解决方案2】：

这里angular2/core 或angular2/platform/browser 等不是路径，而是用于角度的预定义systemjs 包。如果您查看 angular bundal 的 source code，您会看到

System.register("angular2/core", etc ....

这告诉 systemjs 该做什么。你可以找到more here... 同样，我们已经在 index.html 中的 angular 之前导入了 system.js。

https://stackoverflow.com/a/34804834/5043867 angular2 的导入列表

实际上 system.js 是一个模块加载器，有各种各样的模块加载器，但我使用过 system.js 模块加载器，如 commonJs、systemJs 等。

两个加载器都以自己的方式加载模块，例如我们使用代码

 import {Component} from 'angular2/core';

es6中的commonJs加载这段代码是这样的

var core_1 = require('angular2/core'); ...

和systemJs这样绑定这个模块：

System.register(['angular2/core'], function(exports_1) { ...

两个加载器都不错，但快速入门使用 SystemJS。

【讨论】：