Файл "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 './'; або просто помістити код у папку героїв ?

Спробуйте перезапустити редактор, у який ви пишете код (VS-код або Sublime). Складіть і запустіть його ще раз. Я зробив те саме, і це спрацювало.

Це трапляється, коли ви додаєте новий клас поза своїм редактором або продовжуєте виконувати свій кутовий кліп 'ng serve'. Насправді ваш редактор або команда 'ng serve' можуть не в змозі знайти новостворені файли.

Я отримав таку ж помилку в тому самому підручнику, оскільки забув ключове слово для експорту інтерфейсу.

ймовірно, ви забули додати "Експорт" у визначенні класу.

->

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

Також спробуйте

export {Hero} 

внизу класу hero.ts і, нарешті, перевірте ім'я файлу з великої літери та ім'я класу.

Помилка полягає в тому, що ви не зберегли файли після їх створення.

Спробуйте зберегти весь файл, натиснувши "Зберегти все" в Редакторі.

Ви можете побачити кількість файлів, які не зберігаються, переглянувши меню "Файл", показане синім кольором.

Перезапуск мого ng serveпроцесу працював на мене

Для людей, які отримують ту саму помилку на stackblitz

Ви знайдете вкладку " Залежність" на лівій бічній панелі IDE. Просто натисніть кнопку оновлення поруч із нею, і ви будете добре їхати.

Як я відчував кожного разу, коли я додав новий файл до свого проекту, мені довелося зупинити і перезапустити сервер ng.

У підручнику ви розміщуєте всі компоненти та файл інтерфейсу в одному каталозі, отже, відносний імпорт, './hero'якщо ви хочете перемістити його в інше місце, вам потрібно змінити це.

Редагувати: код все ще може працювати, але компілятор скаржиться на те, що ви намагаєтесь імпортувати з неправильного місця. Я б просто змінив імпорт на основі вашої структури. Наприклад:

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

Я б просто змінив імпорт на import {Hero} from '../hero'.

Ця помилка викликана відмовою сервера ng serveдля автоматичного підбору нещодавно доданого файлу. Щоб виправити це, просто перезавантажте сервер.

Хоча закриття повторного відкриття текстового редактора або IDE вирішує цю проблему, багато людей не хочуть переживати весь стрес від повторного відкриття проекту. Щоб виправити це, не закриваючи текстовий редактор ...

У терміналі, де працює сервер,

• Натисніть, ctrl+Cщоб зупинити сервер потім,
• Запустіть сервер ще раз: ng serve

Це має спрацювати.

Я зіткнувся з тим же питанням.

Я перезапустив сервер, і він працює чудово. Схоже на помилку.

перезапустити сервіс

У мене було те саме питання. З метою пошуку помилки я вибрав помилку і випадково зробив CTRL + C (мається на увазі копіювати), який припинив службу ng. При перезапуску сервісу помилка зникла :). Іноді допомагають друкарські помилки і жирові пальці ;-)

Випуск редактора. Коли ви створюєте нові файли, в яких не використовується Angular CLI, переконайтеся, що ви перейдете у меню Файл> Зберегти всі (код VS), щоб повідомити Редактору про ваші нові зміни. Потім знову запустіть "ng serve --open". Це вирішило моє. Сподіваюся, це допомагає

Я зіткнувся з тим же випуском у VSC. Перезапустив редактор і запустив програму знову. Це добре працювало.

Я виявив, що мені довелося не тільки перезапустити Visual Studio Code, але й процес роботи сервера вузлів, перш ніж я міг отримати гарну компіляцію.

Я зіткнувся з тією ж проблемою, спробував перезапустити сервер, перезапустити редактор, але перезавантаження комп’ютера зробило магію.

PS: Я зіткнувся з проблемою на машині Windows, і проблема виникла, коли я перемістив модуль у нову папку.

У мене було подібне питання. Я написав героя замість Героя

імпортуйте наступне:

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

Іноді ця помилка виникає, коли .ts файл не зберігається. Тому переконайтеся, що всі файли проекту збережені, інакше спробуйте перезапустити редактор.

Відкрийте командний рядок, перейдіть до папки додатків, наприклад D:\angular-tour-of-heroes\src\app

Потім створіть новий файл за допомогою наступної команди:

ng generate class hero

Це створить hero.tsфайл. Потім ви можете вставити експортний код, і помилка зникла.

Вам слід зберегти всі файли. Наприклад, html, css, компонент.ts, модуль, файли моделі. Відкрийте кожен файл і натисніть ctrl-S. Це працювало для мене

У моєму випадку я забув зберегти зміни у файлі "app / hero.ts", після збереження та перезавантаження сервісу проблема була вирішена.

Моя резолюція,

У моєму випадку я створив модельний файл і зберігав його порожнім,

тому коли я імпортував його до іншої моделі, це дає мені помилку. тому напишіть визначення під час створення файлу типового сценарію моделі.

змінити

import{observable} from 'rxjs/observable'; 

до

import{observable} from 'rxjs';

переконайтеся, що ви зберегли .TS файл перед компіляцією.

додайте це до експорту класу

@Injectable({
  providedIn: 'root'
})