angular2 Directive is not defined 에러

 angular with typescript development 책을 구입하여 따라가는데

folder를 만들고 index.html, main.ts 를 만들고

디렉티브 를 실습하다가


zone.js@0.8.5:571 Error: Uncaught (in promise): Error: (SystemJS) Directive is not defined
ReferenceError: Directive is not defined
   at execute (http://127.0.0.1:8080/main.ts!transpiled:48:17)
   at ZoneDelegate.invoke (https://unpkg.com/zone.js@0.8.5:365:26)
   at Zone.run (https://unpkg.com/zone.js@0.8.5:125:43)
   at https://unpkg.com/zone.js@0.8.5:760:57
   at ZoneDelegate.invokeTask (https://unpkg.com/zone.js@0.8.5:398:31)
   at Zone.runTask (https://unpkg.com/zone.js@0.8.5:165:47)
   at drainMicroTaskQueue (https://unpkg.com/zone.js@0.8.5:593:35)
   at XMLHttpRequest.ZoneTask.invoke (https://unpkg.com/zone.js@0.8.5:464:25)
Error loading http://127.0.0.1:8080/main.ts
(SystemJS) Directive is not defined
ReferenceError: Directive is not defined
   at execute (http://127.0.0.1:8080/main.ts!transpiled:48:17)
   at ZoneDelegate.invoke (https://unpkg.com/zone.js@0.8.5:365:26)
   at Zone.run (https://unpkg.com/zone.js@0.8.5:125:43)
   at https://unpkg.com/zone.js@0.8.5:760:57
   at ZoneDelegate.invokeTask (https://unpkg.com/zone.js@0.8.5:398:31)
   at Zone.runTask (https://unpkg.com/zone.js@0.8.5:165:47)
   at drainMicroTaskQueue (https://unpkg.com/zone.js@0.8.5:593:35)
   at XMLHttpRequest.ZoneTask.invoke (https://unpkg.com/zone.js@0.8.5:464:25)
Error loading http://127.0.0.1:8080/main.ts
   at execute (http://127.0.0.1:8080/main.ts!transpiled:48:17)
   at ZoneDelegate.invoke (https://unpkg.com/zone.js@0.8.5:365:26)
   at Zone.run (https://unpkg.com/zone.js@0.8.5:125:43)
   at https://unpkg.com/zone.js@0.8.5:760:57
   at ZoneDelegate.invokeTask (https://unpkg.com/zone.js@0.8.5:398:31)
   at Zone.runTask (https://unpkg.com/zone.js@0.8.5:165:47)
   at drainMicroTaskQueue (https://unpkg.com/zone.js@0.8.5:593:35)
   at XMLHttpRequest.ZoneTask.invoke (https://unpkg.com/zone.js@0.8.5:464:25)
Error loading http://127.0.0.1:8080/main.ts
(SystemJS) Directive is not defined
ReferenceError: Directive is not defined
   at execute (http://127.0.0.1:8080/main.ts!transpiled:48:17)
   at ZoneDelegate.invoke (https://unpkg.com/zone.js@0.8.5:365:26)
   at Zone.run (https://unpkg.com/zone.js@0.8.5:125:43)
   at https://unpkg.com/zone.js@0.8.5:760:57
   at ZoneDelegate.invokeTask (https://unpkg.com/zone.js@0.8.5:398:31)
   at Zone.runTask (https://unpkg.com/zone.js@0.8.5:165:47)
   at drainMicroTaskQueue (https://unpkg.com/zone.js@0.8.5:593:35)
   at XMLHttpRequest.ZoneTask.invoke (https://unpkg.com/zone.js@0.8.5:464:25)
Error loading http://127.0.0.1:8080/main.ts
    at resolvePromise (https://unpkg.com/zone.js@0.8.5:712:31) [<root>]
    at resolvePromise (https://unpkg.com/zone.js@0.8.5:683:17) [<root>]
    at https://unpkg.com/zone.js@0.8.5:760:17 [<root>]
    at Zone.runTask (https://unpkg.com/zone.js@0.8.5:165:47) [<root> => <root>]
    at drainMicroTaskQueue (https://unpkg.com/zone.js@0.8.5:593:35) [<root>]
    at XMLHttpRequest.ZoneTask.invoke (https://unpkg.com/zone.js@0.8.5:464:25) [<root>]
consoleError @ zone.js@0.8.5:571
handleUnhandledRejection @ zone.js@0.8.5:574
_loop_1 @ zone.js@0.8.5:609
drainMicroTaskQueue @ zone.js@0.8.5:613
ZoneTask.invoke @ zone.js@0.8.5:464

이런 애러를 만났다.

zone.js는 angular에서 변화를 감지하는데 사용한다던데 왜 directive를 저기서 찾지?;

angular-cli를 사용해서 프로젝트를 만들면 다 알아서 로드하고 알아서 설치해주는데
이렇게 시작해보면 왜안되는지 모르겠다 ㅎㅎ