Getting Error with HttpClient Module in angular

Question

ERROR in node_modules/@angular/common/http/http.d.ts:81:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.

This likely means that the library (@angular/common/http) which declares HttpClient has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.

81 export declare class HttpClient {

Gershom

{ "scripts": { "postinstall": "ngcc" } } – Observable

Answer 1

Maybe you have imported HttpClient instead ofHttpClientModule. Check imports in app.module.ts

imports: [  
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    MatToolbarModule,
    FlexLayoutModule,
    HttpClientModule
  ],

Weigle

Answer 2

That precisely is, when it comes to importing it should be HttpClientModule and when it comes to usage it should be HttpClient

Reference: https://angular.io/guide/http

Lenticel

Answer 3

1. npm cache verify

2. npm cache clean --force

Beker

Answer 4

I faced Same Issue in AngularJs Version 13:

Error: node_modules/@angular/common/http/http.d.ts:91:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class

This likely means that the library (@angular/common/http) which declares HttpClient has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.

Solution : That Error is Our HttpClientModule is Not Import In our

app.module.ts file

Then You Can Add HttpClientModule to imports Area. *

@NgModule({
  declarations: [AppComponent],
  // After import here Above Import API
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    HttpClientModule,
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

Blab

Answer 5

I had the same problem. It's working to me.

Finish serve project to : Crtl+c, npm install and build again ng serve --open

Martita

Answer 6

I had the same problem, I just ran the following command and it worked for me.

npm cache verify

If it doesn't work, manually delete node_module and reinstall it.

rm -rf node_modules
npm install

And also you need to add HttpClientModule just after BrowserModule. Otherwise, it won't work. See below.

imports: [  
   BrowserModule,
   HttpClientModule,
   AppRoutingModule,
   BrowserAnimationsModule,
   MatToolbarModule,
   FlexLayoutModule
],

Often

Answer 7

In app.module.ts => import { HttpClientModule } from '@angular/common/http';

In the service => import { HttpClient } from '@angular/common/http';

Forthcoming

Answer 8

The HttpClientModule needs to be imported under @NgModule section. So make sure it is under "imports" as opposed to the "declaration" section. This should resolve the problem as in: imports: [ BrowserModule, HttpClientModule, FormsModule, AppRoutingModule, ],

Incommodious

Answer 9

I made it work!

1. At app.module.ts, add HttpClientModule import, not HttpClient

import { HttpClientModule } from '@angular/common/http';

2. At app.module.ts, add HttpClientModule in imports section

`

imports: [  
BrowserModule,
AppRoutingModule,
FormsModule,
HttpClientModule
  ],

`

3. At the **service.ts, do not import HttpClientModule. add HttpClient import instead.

import { HttpClient } from '@angular/common/http';

I hope this is clear now!

Fauces

Welcome to SO and thanks for sharing. This answer seems to be the same as the other existing answers here. Going forward, try to help improve existing answers instead of creating duplicates. – Photomural

Answer 10

Just try to run the following command

npm install

Camara