文件'app/hero.ts'在控制台中不是模块错误,在哪里用angular2存储目录结构中的接口文件？

Question

我正在angular2这个地址做教程:https://angular.io/docs/ts/latest/tutorial/toh-pt3.html我把hero接口放在文件app夹下的单个文件中,在控制台中我有这个错误:

app/app.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module.
[0] app/hero-detail.component.ts(2,20): error TS2306: File 'app/hero.ts' is not a module.

如果我把我的接口文件放在一个英雄文件夹中,错误消失了,这在文档中没有提到,我的导入有什么问题？

我的导入指令(在组件文件的引导中)app.components.ts和hero-detail.component.ts:

import {Component} from 'angular2/core';

import {Hero} from './hero';

我必须通过以下方式替换我的import指令:import {Hero} from './'; 或者只是将代码放在一个英雄文件夹中？

谢谢你的回答.

Answer 1

尝试重新启动编写代码的编辑器(VS代码或Sublime).编译并再次运行它.我也做了同样的工作.

当您从编辑器外部添加新类或继续运行角度cli'ng服务'时会发生这种情况.实际上你的编辑器或'ng serve'命令可能无法找到新创建的文件.

Answer 2

我在同一个教程中遇到了同样的错误,因为我忘记了界面的export关键字.

Answer 3

可能你忘了在类定义中添加"导出".

- >

export class Hero {
     id: number;
     name: string;
   }

另外,试试吧

export {Hero} 

在你的hero.ts类的底部,最后检查大写字母文件名和类名.

Answer 4

该错误是因为您在创建文件后尚未保存文件.

尝试通过单击编辑器上的"全部保存"来保存所有文件.

您可以通过查看使用蓝色显示的"文件"菜单下方看到未保存的文件数.

Answer 5

重启我的ng serve过程对我有用

Answer 6

对于人们在stackblitz上遇到相同的错误

您将在IDE的左侧栏中找到“ 依赖关系”选项卡。只需单击其旁边的刷新按钮，您就可以使用了。