角度错误NG6002:出现在AppModule的NgModule.imports中，但无法解析为NgModule类

Question

node_modules/@angular/material/dialog/dedialog中的错误。d.ts:142:22-错误NG6002:出现在AppModule的NgModule.imports中，但可能无法解析为NgModule类。

这可能意味着声明ngcc没有正确处理MatDialog，或者没有与Angular Ivy兼容。检查库的更新版本可用，如果可用则进行更新。也可以考虑使用库的作者查看该库是否兼容艾薇。

142导出声明类MatDialog扩展_MatDialogBase｛

我已经尝试过：

• 更新/重新安装-->无影响
• 重新启动服务器/空缓存-->无影响
• 禁用Ivy-->其他错误
• 禁用aoc-->没有错误，但白色页面
• "postinstall"："ngcc"-->无影响
• 以sudo身份运行-->无影响

请帮帮我，我尝试了很多东西，我正在操作

应用程序模块.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { SharedModule } from './shared/shared.module';
import { HomePageComponent } from './home-page/home-page.component';
import { environment } from 'src/environments/environment';
// Firebase imports
import { AngularFireModule } from '@angular/fire';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFireStorage } from '@angular/fire/storage';
import { CommonModule } from '@angular/common';
//import { SearchBarComponent } from './shared/navbar/search-bar/search-bar.component';
import { AngularFireAuthGuard } from '@angular/fire/auth-guard';
import { NewCommentComponent } from './comments/new-comment/new-comment.component';
import { NewDocumentComponent } from './documents/new-document/new-document.component';
import { QuestionComponent } from './documents/question/question.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SingleDocumentComponent } from './documents/single-document/single-document.component';
import { EditDocumentComponent } from './documents/edit-document/edit-document.component';
import { TemplateComponent } from './documents/template/template.component';
import { HttpClientModule} from '@angular/common/http';
import { AngularFireFunctions, FUNCTIONS_REGION } from '@angular/fire/functions';
import { EditorModule } from '@tinymce/tinymce-angular';
import { CategoryDialogComponent } from './home-page/category-dialog/category-dialog.component';
import { DocumentCheckoutComponent } from './documents/document-checkout/document-checkout.component';
import { CarouselComponent } from './home-page/carousel/carousel.component';
import { ProPageComponent } from './pro-page/pro-page.component';
import { MarkdownEditorModule } from './markdown-editor/markdown-editor.module';
import { MarkdownEditorOptions } from './markdown-editor/markdownEditorOptions';
// import { CheckoutComponent } from './checkout/checkout.component';
import { MatDialog } from '@angular/material/dialog';

const editorConfig = new MarkdownEditorOptions();
editorConfig.autoDownloadFontAwesome = true;
editorConfig.initialValue = 'Hello Editor...write something amazing.';
@NgModule({
declarations: [
AppComponent,
HomePageComponent,

NewCommentComponent,
NewDocumentComponent,
QuestionComponent,
SingleDocumentComponent,
EditDocumentComponent,
TemplateComponent,
CategoryDialogComponent,
DocumentCheckoutComponent,
CarouselComponent,
ProPageComponent,
// CheckoutComponent,

],
imports: [
BrowserModule,
CommonModule,
AppRoutingModule,
BrowserAnimationsModule,
SharedModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFirestoreModule,
AngularFireAuthModule,
FormsModule,
ReactiveFormsModule,
HttpClientModule,
EditorModule,
MarkdownEditorModule.forRoot(editorConfig),
MatDialog,
],
providers: [
AngularFireAuthGuard,
AngularFireStorage,
AngularFireFunctions,
{ provide: FUNCTIONS_REGION, useValue: 'europe-west1'}
],
bootstrap: [AppComponent]
})
export class AppModule { }

package.json

{
"name": "XXXX",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^10.2.1",
"@angular/cdk": "^10.2.7",
"@angular/common": "^10.2.1",
"@angular/compiler": "^10.2.1",
"@angular/core": "^10.2.1",
"@angular/fire": "^5.4.2",
"@angular/forms": "^10.2.1",
"@angular/material": "^10.2.7",
"@angular/platform-browser": "^10.2.1",
"@angular/platform-browser-dynamic": "^10.2.1",
"@angular/router": "^10.2.1",
"@ngtools/webpack": "^10.2.0",
"@stripe/stripe-js": "^1.11.0",
"@tinymce/tinymce-angular": "^4.2.0",
"algoliasearch": "^4.6.0",
"angular-instantsearch": "^2.3.0",
"bootstrap": "^4.5.3",
"firebase": "^7.24.0",
"firebase-functions": "^3.13.0",
"html-to-pdfmake": "^2.1.0",
"html2canvas": "^1.0.0-rc.7",
"jspdf": "^2.1.1",
"ng-image-slider": "^2.6.4",
"ng2-pdf-viewer": "^6.3.2",
"ngx-bootstrap": "^5.6.2",
"ngx-clipboard": "^13.0.1",
"ngx-owl-carousel-o": "^3.1.1",
"nodemailer": "^6.4.14",
"npm": "^6.14.8",
"pdfmake": "^0.1.68",
"stripe": "^8.119.0",
"tinymce": "^5.7.1",
"tslib": "^1.14.1",
"zone.js": "~0.10.3"
},
"devDependencies": {
"@angular-devkit/architect": "^0.900.7",
"@angular-devkit/build-angular": "^0.1002.0",
"@angular/cli": "^10.2.0",
"@angular/compiler-cli": "^10.2.1",
"@angular/language-service": "^10.2.1",
"@types/jasmine": "^3.6.1",
"@types/jasminewd2": "^2.0.8",
"@types/node": "^12.19.3",
"@types/stripe-checkout": "^1.0.3",
"@types/stripe-v3": "^3.1.21",
"codelyzer": "^5.2.2",
"firebase-tools": "^7.16.2",
"fuzzy": "^0.1.3",
"inquirer": "^6.2.2",
"inquirer-autocomplete-prompt": "^1.3.0",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.5.4",
"protractor": "^5.4.4",
"ts-node": "~8.3.0",
"tslint": "~5.18.0",
"typescript": "~4.0.5"
}
}

Answer 1

更改此行：

import { MatDialog } from '@angular/material/dialog';

带有：

import { MatDialogModule } from '@angular/material/dialog';

也可以在您的进口中更改：(

Answer 2

对我来说，这个问题是通过Docker安装npm包解决的，命令是：

docker exec -it [name of your container] bash

如果bash不起作用，可以只使用sh。在那之后，我只通过运行标准来安装它们

npm i [name of package]

通过命令提示符。