'app / hero.ts'파일은 콘솔에서 모듈 오류가 아닙니다. angular2를 사용하여 디렉토리 구조에서 인터페이스 파일을 저장할 위치는 무엇입니까?

'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.

인터페이스 파일을 영웅 폴더에 오류가 사라지면 문서에 언급되지 않았으며 가져 오기에 어떤 문제가 있습니까?

모두 (구성 요소 파일의 beguining에서) 내 import 지시문 app.components.ts과 hero-detail.component.ts:

import {Component} from 'angular2/core';

import {Hero} from './hero';

가져 오기 지시문을 다음으로 대체해야합니까, import {Hero} from './'; 아니면 단순히 코드를 hero 폴더에 넣어야 합니까?

답변 감사합니다.

---

코드를 작성하는 편집기 (VS 코드 또는 Sublime)를 다시 시작하십시오. 컴파일하고 다시 실행하십시오. 나는 똑같이했고 효과가있었습니다.

에디터 외부에서 새로운 클래스를 추가하거나 앵귤러 클리 'ng serve'를 계속 실행하면 이런 일이 발생합니다. 실제로 편집기 또는 'ng serve'명령이 새로 작성된 파일을 찾지 못할 수 있습니다.

---

인터페이스 의 내보내기 키워드를 잊어 버렸기 때문에 동일한 자습서에서 동일한 오류가 발생했습니다 .

---

아마도 클래스 정의에 "내보내기"를 추가하는 것을 잊었을 것입니다.

->

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

또한 사용해보십시오

export {Hero} 

hero.ts 클래스의 맨 아래에 마지막으로 대문자 파일 이름과 클래스 이름을 확인하십시오.

---

파일을 작성한 후 저장하지 않았기 때문에 오류가 발생합니다.

편집기에서 "모두 저장"을 클릭하여 모든 파일을 저장하십시오.

파란색으로 표시된 "파일"메뉴를 보면 저장되지 않은 파일 수를 확인할 수 있습니다.

---

ng serve프로세스를 다시 시작 하면 나를 위해 일했습니다.

---

stackblitz 에서 동일한 오류가 발생하는 사람들을 위해

당신은 발견 할 것이다 종속성 IDE의 왼쪽 사이드 바에서 탭을 선택합니다. 옆에있는 새로 고침 버튼을 클릭하기 만하면됩니다.

---

---

프로젝트에 새 파일을 추가 할 때마다 경험했듯이 ng 서버를 중지했다가 다시 시작해야합니다.

---

이 오류는 ng serve서브 서버가 새로 추가 된 파일을 자동으로 가져 오기 때문에 발생 합니다. 이 문제를 해결하려면 서버를 다시 시작하면됩니다.

텍스트 편집기 나 IDE를 다시 열면이 문제가 해결되지만 많은 사람들이 프로젝트를 다시 열어야하는 모든 스트레스를 겪고 싶지는 않습니다. 텍스트 편집기를 닫지 않고이 문제를 해결하려면 ...

서버가 실행중인 터미널에서

• 를 눌러 ctrl+C서버를 중지 한 다음
• 서버를 다시 시작하십시오. ng serve

작동합니다.

---

이 자습서에서는 모든 구성 요소와 인터페이스 파일을 동일한 디렉토리에 배치하므로 './hero'이를 변경해야하는 다른 위치로 이동 하려면 상대 가져 오기 를 수행해야합니다.

편집 : 코드가 여전히 작동 할 수 있지만 잘못된 위치에서 가져 오기를 시도하고 있기 때문에 컴파일러가 불평합니다. 단순히 구조에 따라 가져 오기를 변경하고 싶습니다. 예를 들면 다음과 같습니다.

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

간단히 가져 오기를로 변경합니다 import {Hero} from '../hero'.

---

나는 같은 문제에 직면했다.

I restarted my server and it works fine. Seems like a bug.

---

restart ng serve

I had the same issue. In order to search for the error, I selected the error and accidentally did a CTRL+C (meaning to copy), which terminated ng serve. On restarting ng serve, the error disappeared :). Sometimes typos and fat fingers help ;-)

---

Editor issue. When you create new files that not using Angular CLI, make sure you go to File > Save All (VS Code) to let the Editor aware of your new changes. Then run "ng serve --open" again. It solved mine. Hope it helps

---

I ran into the same issue in VSC. Did restarted the editor and started the application again. It worked fine.

---

I found that not only did I have to restart Visual Studio Code but the node server process as well before I could get a good compile.

---

I was facing same issue, tried restarting my server, reopening editor but computer restart did the magic.

P.S: I was facing issue on a windows machine and issue occurred when I moved module into a new folder.

---

I had a similar issue. I wrote hero instead of Hero

import the following:

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

---

Sometimes this error occurs when the .ts file is not saved. So make sure all files in the project are saved otherwise try to restart the editor.

---

Open command prompt, go to the app folder, e.g. D:\angular-tour-of-heroes\src\app

Then create a new file using the following command:

ng generate class hero

This will create a hero.ts file. Then you can paste the export code, and the error is gone.

---

You should save all the files. For example html, css, component.ts, module, model files. Open each file and press ctrl-S. This worked for me

---

내 경우에는 'app / hero.ts'파일에 변경 사항을 저장하는 것을 잊어 버렸습니다. 서비스를 저장하고 다시 시작한 후에 문제가 해결되었습니다.

---

내 결의안,

제 경우에는 모델 파일을 만들어 비워 두었습니다.

다른 모델로 가져 오면 오류가 발생합니다. 따라서 모델 타입 스크립트 파일을 만들 때 정의를 작성하십시오.

---

나는 각도 7을 사용하고 있습니다. 내 hero.ts 파일 내에서 아래와 같이 변경했습니다.

from: export interface Hero 
to: export class Hero 

참고 : 실제 클래스 이름이 다르고 값 객체 또는 dto로 사용되었습니다.

참고 : https://stackoverflow.com/questions/34629517/file-app-hero-ts-is-not-a-module-error-in-the-console-where-to-store-interfac