The weirdest error I got so far.

I generated a new component in angular 13, and since then I am getting this error. I deleted the component, but I still get the same error. It goes as follows:

The error:

Uncaught (in promise): NullInjectorError:
R3InjectorError(AppModule)[HttpService ->
ModuleSkillCollectionComponent -> ModuleSkillCollectionComponent ->
ModuleSkillCollectionComponent]: NullInjectorError: No provider for
ModuleSkillCollectionComponent!

When I scroll down, I come across the following message:

And this takes me to:

<nav class="navbar max-w-full w-full mx-auto">
  <div class="flex-1">
    <div class="w-full top-0 border-b">
      <ul class="menu menu-horizontal w-screen">
        <li class="left-0 top-0 font-bold"><a href="">CompetentieApp</a></li>
        <li class="mr-10">
          <a routerLinkActive="tab-active" href="/faq">Eindniveaus</a>
        </li>
        <li class="mr-10"><a href="/faq">Overzicht Alle Modules</a></li>
        <li class="mr-10"><a href="/faq">Beheer</a></li>
        <li class="mr-10">
          <a routerLinkActive="tab-active" routerLink="moduleCompetenties">Logout</a>
        </li>
        <img
          class="absolute w-14 md:w-36 mr-10 right-0 top-0"
          src="assets/logo.png"
          alt="logo"
        />
      </ul>
    </div>
  </div>
</nav>
<router-outlet></router-outlet>

Here is my app-routing.ts:

const routes: Routes = [
  { path: '', redirectTo: 'home', pathMatch: 'full' },
  { path: 'moduleCompetenties', component: ModuleSkillCollectionComponent },
  { path: '**', redirectTo: 'home', pathMatch: 'full' },
];

@NgModule({
  imports: [
      CommonModule,
      RouterModule.forRoot(routes)
  ],
  exports: [RouterModule],
})
export class AppRoutingModule {}

Any idea how to solve it?