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

Спасибо за ваши ответы.

Ответ 1

Попробуйте перезапустить редактор, в котором вы пишете код (код VS или Sublime). Скомпилируйте и запустите его снова. Я сделал то же самое, и это сработало.

Это происходит, когда вы добавляете новый класс за пределами вашего редактора или продолжаете выполнять угловую операцию. На самом деле ваш редактор или команда 'ng serve' могут не найти вновь созданные файлы.

Ответ 2

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

Ответ 3

возможно, вы забыли добавить "Экспорт" в определение класса.

- >

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

Кроме того, попробуйте с

export {Hero}

внизу вашего класса hero.ts и, наконец, проверьте имя и фамилию заглавной буквы.

Ответ 4

Ошибка в том, что вы не сохранили файлы после их создания.

Попробуйте сохранить все файлы, нажав "Сохранить все" в редакторе.

Вы можете увидеть количество файлов, которые не были сохранены, посмотрев под меню "Файл", показанное синим цветом.

Ответ 5

Перезапуск моего процесса ng serve работал у меня

Ответ 6

Эта ошибка вызвана отказом службы ng serve для автоматического получения вновь добавленного файла. Чтобы исправить это, просто перезагрузите сервер.

Несмотря на то, что закрытие повторного открытия текстового редактора или IDE решает эту проблему, многие люди не хотят переживать все усилия по возобновлению проекта. Исправить это, не закрывая текстовый редактор...

В терминале, где работает сервер,

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

Это должно сработать.

Ответ 7

Как я когда-либо добавлял новый файл в свой проект, я должен был остановить и перезапустить ng-сервер.

Ответ 8

Для людей, получающих ту же ошибку на stackblitz

Вы найдете вкладку Зависимости на левой боковой панели IDE. Просто нажмите кнопку обновления рядом с ним, и вам будет хорошо идти.

Ответ 9

В учебнике вы помещаете все компоненты и файл интерфейса в один и тот же каталог, следовательно относительный импорт './hero', если вы хотите переместить его в другое место, вам нужно изменить это.

Изменить: Код может по-прежнему работать, но компилятор будет жаловаться, потому что вы пытаетесь импортировать из неправильного местоположения. Я бы просто изменил импорт на основе вашей структуры. Например:

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

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

Ответ 10

перезапустить нг служить

Я была такая же проблема. Чтобы найти ошибку, я выбрал ошибку и случайно нажал сочетание клавиш CTRL + C (имеется в виду копировать), что завершило ng serve. При перезапуске ng serve ошибка исчезла :). Иногда помогают опечатки и толстые пальцы ;-)

Ответ 11

Проблема редактора. Когда вы создаете новые файлы, которые не используют Angular CLI, убедитесь, что вы идете в File> Save All (VS Code), чтобы Редактор знал о ваших новых изменениях. Затем снова запустите "ng serve --open". Это решил мой. Надеюсь, поможет

Ответ 12

Я столкнулся с той же проблемой в VSC. Перезапустил редактор и снова запустил приложение. Он работал нормально.

Ответ 13

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

Ответ 14

Я столкнулся с той же проблемой.

Я перезапустил свой сервер, и он отлично работает. Похоже на ошибку.

Ответ 15

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

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

Ответ 16

У меня была похожая проблема. Я написал герой вместо героя

импортировать следующее:

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

Ответ 17

Мое разрешение,

В моем случае я создал файл модели и оставил его пустым,

поэтому, когда я импортировал его в другую модель, он выдает ошибку. поэтому напишите определение при создании файла машинописи модели.

Ответ 18

Иногда эта ошибка возникает, когда файл .ts не сохраняется. Поэтому убедитесь, что все файлы в проекте сохранены, в противном случае попробуйте перезапустить редактор.

Ответ 19

Откройте командную строку, перейдите в папку приложения, например, D:\angular-tour-of-heroes\src\app

Затем создайте новый файл, используя следующую команду:

ng generate class hero

Это создаст файл hero.ts Затем вы можете вставить код экспорта, и ошибка исчезла.

Ответ 20

Вы должны сохранить все файлы. Например, html, css, component.ts, модуль, файлы модели. Откройте каждый файл и нажмите Ctrl-S. Это сработало для меня

Ответ 21

В моем случае я забыл сохранить изменения в файле app/hero.ts, после сохранения и перезапуска ng serve проблема была решена.