ng 构建 -prod 返回错误

Question

我正在使用角度cli来构建和运行angluar2应用程序。

当我跑步时：ng server一切都很好。但是当我运行ng build -prod时，它会抛出错误：

ERROR in Unexpected directive 'ObservableComponent in /Users/projectName/Dev02/dashboard-app/src/app/book/observable.component.ts' imported by the module 'BookComponent in /Users/projectName/Dev02/dashboard-app/src/app/book/book.component.ts'. Please add a @NgModule annotation.
ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/Users/projectName/Dev02/dashboard-app/src'
@ ./src/main.ts 3:0-74
@ multi ./src/main.ts

下面是 observable.component.ts 的代码：

import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { BookService } from '../_service/book.service';
import { Book } from './book';
@Component({
selector: 'app-observable',
templateUrl: 'observable.component.html',
styleUrls: ['observable.component.css']
})

export class ObservableComponent implements OnInit { 
constructor(private bookService: BookService) { }
ngOnInit(): void {
this.fetchBooks();
}
}

和 book.component.ts：

import {NgModule, Component, OnInit } from '@angular/core';
import { ObservableComponent } from './observable.component';
import { PromiseComponent } from './promise.component';
@Component({
template:  `
<div class="wrapper-obervable-pormise">
<div class="wrapper-observable">
<app-observable></app-observable>
</div>
<div class="wrapper-promise">
<app-promise></app-promise>
</div>
</div>
`,
styleUrls: ['./book.component.css']
})
@NgModule({
declarations: [
ObservableComponent,
PromiseComponent
],
imports: [
ObservableComponent,
PromiseComponent
],
exports: [
ObservableComponent,
PromiseComponent
]
})
export class BookComponent {}

知道出了什么问题吗？

Answer 1

NgModule.imports只接受模块，不接受组件。

因此，您应该从导入数组中删除ObservableComponent和PromiseComponent。

例如

@NgModule({
declarations: [
ObservableComponent,
PromiseComponent
],
imports: [],
exports: [
ObservableComponent,
PromiseComponent
]
})

来自 Angular Docs：下一部分是通过说明哪些组件和指令属于它(声明(以及它使用(导入(的其他模块来配置@NgModule。有关@NgModule结构的更多信息，请务必阅读引导。