'Angular: HttpClientModule import error (could not be resolved to an NgModule class)

I was trying to build a simple app with crud on fake json server

but i can't import HttpClientModule

Here is error message from VS Code :

ERROR in node_modules/@angular/common/http/http.d.ts:2801: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 HttpClientModule 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.

    2801 export declare class HttpClientModule {

Here is app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { EmployeeCreateComponent } from './employee-create/employee-create.component';
import { EmployeeEditComponent } from './employee-edit/employee-edit.component';
import { EmployeeListComponent } from './employee-list/employee-list.component';

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


@NgModule({
  declarations: [
    AppComponent,
    EmployeeCreateComponent,
    EmployeeEditComponent,
    EmployeeListComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'restTest6';
}

note that : I didn't use HttpClientModule anywhere else. I imported and did ng serve -o and got error. Please point out what went wrong

angular typescript

Solution 1:^[1]

I had the same problem, I just run the following command and it worked after without any error.

npm cache verify

If it does not, try manually deleting the node_modules folder and reinstalling the modules with npm install.

rm -rf node_modules
npm install

On npm > 6, you can also run npm ci, which also deletes the node_modules folder and reinstall packages after.

Edit As other answers suggested, you may need to restartng serve if the above steps do not work (but they normally do)

Solution 2:^[2]

just stop ng serve before adding new package, after adding new package restart ng serve. This will solve this issue.

Solution 3:^[3]

First Stop ng serve and run these commands...

npm cache verify
rm -rf node_modules
npm install

After the installation build & run your project using the commands

ng build
ng serve

It works for me and solve the issue...

Solution 4:^[4]

You can add this HttpClientModule to imports in app.component.ts.

imports: [HttpClientModule]

Solution 5:^[5]

I resolved this issue by using the following steps

stoped ng serve cmd
ran npm cache verify cmd
started ng serve cmd

Solution 6:^[6]

First of all, you just need to delete the node-modules folder then update the npm by using the command

npm i -g npm

Then you need to build your project for maintenance of the angular project which can be done by using the command

ng build

then you will be able to serve or host the project by typing the command

ng serve

Solution 7:^[7]

I had the same issue. So, I manually deleted node_modules and then npm install. It solved as this issue was because of the corrupt dependencies.

Solution 8:^[8]

In my case closed VS Code, re-opened the project and did 'ng serve'. It worked.

Solution 9:^[9]

In my case, I was making some unit tests and I have added HttpModule into the app.module.ts file in the imports section. To solve this problem I just removed the HttpModule import from the app module and it fixed the error.

// app.module.ts

@NgModule({
  declarations: [AppComponent, ...],
  imports: [
    // Removed from here <--
   ...

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1
Solution 2	Akash Agarwal
Solution 3	Dharman
Solution 4	m4n0
Solution 5	Vinod
Solution 6
Solution 7	Komal Chauhan
Solution 8	Sudhir Rao
Solution 9	V. Nogueira

'Angular: HttpClientModule import error (could not be resolved to an NgModule class)

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Solution 5:[5]

Solution 6:[6]

Solution 7:[7]

Solution 8:[8]

Solution 9:[9]