"Ошибки анализа шаблона:" приложение "не является известным элементом", когда приложение "ОК" angular2 построено с помощью Webpack2 и развернуто

My angular (v2.4) приложение с angularfire2 работает плавно в среде разработки (экспресс-сервер). Когда я создаю его с помощью "npm run build", Webpack2 создает приложение и помещает его в папку с именем "target". Когда я запускаю встроенное приложение из целевой папки с помощью "сервера npm run", сервер запускается, и браузер не показывает ничего ожидаемого названия приложения. В консоли браузера я получаю эту ошибку:

"Отказ от необработанного обещания: ошибки анализа шаблонов:" приложение "не является Известный элемент: если" приложение "является компонентом angular, а затем убедитесь, что оно является частью этого модуля. Если" приложение "является веб-компонентом, то добавьте" CUSTOM_ELEMENTS_SCHEMA "в" @NgModule.schemas "этого компонента для подавления этого сообщения."

Я предоставляю вам приложение app, index.ts, main.ts здесь. В случае, если вы хотите увидеть webpack.config.js, я тоже могу это предоставить.

Вот мой компонент приложения:

import { Component } from '@angular/core';
import { AuthService } from '../../auth';

@Component({
  selector: 'app',
  template: ` 
    <app-header
      [authenticated]="auth.authenticated"
      (signOut)="signOut()"></app-header>

      <router-outlet></router-outlet>

     <app-footer
      [authenticated]="auth.authenticated"></app-footer>      
  `
})

export class AppComponent {
  constructor(private auth: AuthService) {}

  signOut(): void {
    this.auth.signOut();
  }
}

Вот index.ts моего модуля приложения:

import {NgModule} from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule} from '@angular/router';
import { HttpModule } from '@angular/http';

import { AuthModule } from '../auth';
import { FirebaseModule } from '../firebase';
import { HomeModule} from  '../home';


import { AppComponent } from './components/app';
import { AppHeaderComponent } from './components/app-header';
import {AppFooterComponent} from './components/app-footer';

@NgModule({

  declarations: [
    AppComponent,
    AppHeaderComponent,
    AppFooterComponent
  ],
  bootstrap: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot([], {useHash: false}),
    HttpModule,
    AuthModule,
    FirebaseModule,
    HomeModule,
  ]
})

export class AppModule {}

Вот мой main.ts:

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

// AppModule
import { AppModule } from './app';

// common styles
import './common/styles/_styles.scss';


if (process.env.NODE_ENV === 'production') {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

Ответ 1

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