HttpClientModule Angular 18

I'm doing a project in Angular 18, I want to use the httpClientModule but it tells me that it is deprecated when I want to import it directly into a component. Likewise, when I want to import the httpClient within the imports of the same component it tells me component imports must be standalone components, directives, pipes, or must be NgModules.

I was investigating and it said that the solution is to put the provideHttpClient() function within the providers of the app.module.ts file but in my case I don't have that file, I only have the app.config.ts and app.config.server.ts In which of both should I put it?

The content of both files are this:

//app.config.ts

import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter, withComponentInputBinding } from '@angular/router';
import { routes } from './app.routes';
import { provideClientHydration } from '@angular/platform-browser';
import { provideHttpClient } from '@angular/common/http';

export const appConfig: ApplicationConfig = {
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes, withComponentInputBinding()), provideClientHydration()]
};


//app.config.server.ts
import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
import { provideServerRendering } from '@angular/platform-server';
import { appConfig } from './app.config';
import { provideHttpClient } from '@angular/common/http';

const serverConfig: ApplicationConfig = {
providers: [
provideServerRendering(),
]
};

export const config = mergeApplicationConfig(appConfig, serverConfig);

Continue reading...