Angular入门-Hero Editor抽丝

一.找入口

每样新的事物在我们看来，很多情况就像是看到一颗蚕茧，千丝万缕必须找出丝头，才能牵出一连串的结果。在这之前我们已经了解了Angular和TypeScript，并做了笔记以备学习查询，这便清理掉了一些杂丝。接下来，我们很容易找到了丝头，就是Angular简介中，目录介绍里说的，程序的运行配置文件：
.angular-cli.json

1.找到“main”入口程序是main.ts,如下图：

2.进入main.ts文件中，我们看到引导的主模块为AppModule，

3.按F12（Angular Language Service 有介绍，以后关于编辑中的快捷键，请查阅此链接）即可直接进入到此模块文件中：

二、提问题

看到这个文件，初次接触，有很多问题需要解决

1. 1.import xx from xx,这是什么模块定义呢？

2. @开头的是什么变量？只是命名习惯吗？

3. export 一个空类？不对，上面@NgModule一大段代码肯定有玄机。

那我就一个一个去寻找答案：
**1.**TypeScript中介绍到JavaScript模块加载器是服务于Node.js的 CommonJS和服务于Web应用的Require.js，那这里应该是遵循Require.js，可是Require.js引用模式是：

    require([module], callback);

到这里提到ES6，涉及import,export，好吧，ES6又要fork到Angular的学习中。

先不管其他，涉及什么学什么，先来看看ES6怎么说的ES6 Module：
原来ES6在语言标准层面上实现了更简单的模块功能，取代了CommonJS和AMD规范。优越在于：ES6模块不是对象，不需要在运行时才能知道引入的参数是否正确，而是在编译的时候静态得到。叫做“静态加载”/“编译时加载”.也就是在编译的时候就能完成模块加载，效率更高。
2. Typescript中看到装饰器，就是带@前缀的。而装饰器并不是TS定义的，是ES6就定义的，用来修改类的行为（在我看来并不是修改行为，而是改变类，它的属性、方法等，具体请看ES6官网）。
3.第2个问题解决了，第3个问题也就迎刃而解了。这个导出的不是空类，而是被修饰了的类，是有东西滴。好了，现在丝牵到这里，又有新问题了：

4.这个NgModule修饰器，如何对类有什么影响呢？（请看下一篇《Angular入门-装饰器》）