Сбой компиляции AOT с модулями материалов
Я получаю несколько ошибок, но все они похожи на это:
ERROR in ./node_modules/@angular/material/button/typings/index.ngfactory.js
Module build failed: Error: Invalid name: "@angular/material/button"
at ensureValidName (C:\path\node_modules\normalize-package-data\lib\fixer.js:335:15)
at Object.fixNameField (C:\path\node_modules\normalize-package-data\lib\fixer.js:215:5)
at C:\path\node_modules\normalize-package-data\lib\normalize.js:32:38
at Array.forEach (<anonymous>)
at normalize (C:\path\node_modules\normalize-package-data\lib\normalize.js:31:15)
at final (C:\path\node_modules\read-package-json\read-json.js:411:5)
at then (C:\path\node_modules\read-package-json\read-json.js:160:5)
at ReadFileContext.<anonymous> (C:\path\node_modules\read-package-json\read-json.js:332:20)
at ReadFileContext.callback (C:\path\node_modules\graceful-fs\graceful-fs.js:78:16)
at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:420:13)
@ ./src/components/shared/confirm-delete/confirm-delete.component.ngfactory.js 4:0-96
@ ./src/components/desktop/base/base.module.ngfactory.js
@ ./$$_lazy_route_resource lazy
@ ./node_modules/@angular/core/esm5/core.js
@ ./src/main.aot.ts
Кажется, что ошибки возникают только в модулях, которые являются дочерними модулями, так как кнопка материала используется в других компонентах без этой ошибки. Я подозреваю, что сделал что-то глупое с импортом, но не могу понять, что может вызвать эту ошибку только в дочерних модулях. Версия углового компилятора 5.2.10.
Импорт -
import { MatInputModule } from '@angular/material/input';
import { MatCardModule} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule} from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
Он отлично работает с веб-пакетом и выполняет 'npm run server'. Проблема возникает только при выполнении AOT-компиляции.
1 ответ
Вы можете импортировать угловой материал с:
import {
TooltipComponent,
MatDialogModule,
MatTooltipModule,
MatMenuModule
} from '@angular/material';
@NgModule({
exports: [
MatDialogModule,
MatTooltipModule,
MatMenuModule
]
})
export class MaterialModule { }
@NgModule({
imports: [
MaterialModule
],
bootstrap: [AppComponent],
})
export class AppModule { }
(Инкапсуляция внутри другого ngModule
облегчает отделить его от вашего AppModule
)