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

我正在这个地址做 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 {Hero} from './'; 或者干脆把代码放到“英雄”文件夹中吗？

162120 次浏览
小开

本教程要求您将所有组件和接口文件放在同一个目录中，因此如果要将其移动到其他位置，则需要更改相对导入 './hero'。

编辑: 代码可能仍然可以工作，但编译器会抱怨，因为您试图从一个不正确的位置导入。我会根据你的结构改变进口。例如:

app/
component1/
component1.ts
compnent2/
component2.ts
hero.ts

我只需将导入更改为 import {Hero} from '../hero'。

小开

我在同一个教程中得到了相同的错误，因为我忘记了接口的 出口关键字。

小开
最佳答案

尝试重新启动您正在编写代码的编辑器(VS code 或 Sublime)。 编译并再次运行它。

当您在编辑器之外添加一个新类或者继续运行角度清晰的“发球”时，就会发生这种情况。实际上，您的编辑器或“ ng service”命令可能无法找到新创建的文件。

小开

可能您忘记在类定义中添加“ Export”。

-->

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

还有，试试

export {Hero}

最后，检查大写字母文件名和类名。

小开

我在 VSC 中遇到了同样的问题。重新启动了编辑器并重新启动了应用程序。它工作得很好。

小开

我发现不仅要重新启动 VisualStudio 代码，还要重新启动节点服务器进程，然后才能获得良好的编译。

小开

我也面临同样的问题。

我重启了我的服务器，它运行良好，看起来像个漏洞。

小开

我也面临着同样的问题，试着重启我的服务器，重新打开编辑器，但是电脑重启起了作用。

PS: 我在 Windows 机器上遇到了一个问题，当我将模块移动到一个新的文件夹时发生了这个问题。

小开

重新启动 ng serve程序对我来说很有效

小开

此错误是由于 ng serve服务器自动拾取新添加的文件失败造成的。要解决这个问题，只需重新启动服务器。

虽然关闭重新打开文本编辑器或 IDE 可以解决这个问题，但是许多人并不想经历重新打开项目的所有压力。要在不关闭文本编辑器的情况下修复此问题..。

在服务器运行的终端中,

  • 然后按 ctrl+C停止服务器,
  • 重新启动服务器: ng serve

应该可以。

小开

每当我向项目中添加一个新文件时，我都会停止并重新启动 ng 服务器。

小开

重新发球

我也有同样的问题。为了搜索错误，我选择了该错误并意外地执行了 CTRL + C (意思是复制) ，从而终止了 ng 服务。在重新启动 ng 发球时，错误消失了:)。有时拼写错误和肥胖的手指会有所帮助; -)

小开

我也遇到过类似的问题，我写的是 英雄而不是 英雄

输入以下货品:

import { Hero } from '../Hero';
小开

编辑问题。当您创建不使用角度 CLI 的新文件时，请确保转到 File > Save All (VS Code) ，让编辑器知道您的新更改。那就再来一次“开门发球”。我的问题解决了。希望能有帮助

小开

我的决心,

在我的例子中，我创建了一个模型文件并将其保持为空白,

所以当我把它导入其他模型时，它会给我错误。因此，在创建模型类型脚本文件时编写定义。

小开

错误是因为您在创建文件之后没有保存它们。

尝试保存所有的文件，单击“保存所有”的编辑器。

您可以看到的文件数量，没有保存下面的“文件”菜单显示使用蓝色。

小开

时发生此错误。没有保存 ts 文件。因此，请确保保存项目中的所有文件，否则请尝试重新启动编辑器。

小开

打开命令提示符，转到应用程序文件夹，例如 D:\angular-tour-of-heroes\src\app

然后使用以下命令创建一个新文件:

ng generate class hero

这将创建一个 hero.ts文件。然后您可以粘贴导出代码，错误就消失了。

小开

你应该保存所有的文件。例如 html，css，Component ent.ts，module，model files。打开每个文件并按 ctrl-S。这招对我很管用

小开

在我的例子中，在保存和重新启动 ng 服务器之后，我忘记了保存对文件‘ app/her.ts’的更改，这个问题得到了解决。

小开

对于在 斯塔克闪电战上得到相同错误的人

您将在 IDE 的左侧工具条上找到一个 依赖性选项卡。只要点击它旁边的刷新按钮，你就可以开始了。

enter image description here

小开

改变

import{observable} from 'rxjs/observable';

到

import{observable} from 'rxjs';

在编译之前确保已经保存了.TS 文件。

小开

在导出类之前添加这个

@Injectable({
providedIn: 'root'
})
小开

不要忘记导出您的类或接口。

export interface Sort {
value: string;
viewValue: string;
}
小开

在我的例子中，我指责“ * service.ts”不是一个模块。

为了解决这个问题，我只是在模块的提供者中添加了服务。

小开

我的问题是，我运行的 ng build --prod是一个空白的 environment.prod.ts文件

小开

在我的例子中，我已经从终端创建了 my.ts 文件。自动将编码设置为 UTF-16。Angular 编译器不能处理 UTF-16文件(仅在 Windows 上测试过)。

在我把编码改为 UTF-8之后，一切又恢复正常了。


提交答案