provideServerRendering — Angular

Configures server-side rendering for an Angular application.

API

function provideServerRendering(
  ...features: ServerRenderingFeature<ServerRenderingFeatureKind>[]
): EnvironmentProviders;
function provideServerRendering(
  options: ServerRenderingOptions,
  ...features: ServerRenderingFeature<ServerRenderingFeatureKind>[]
): EnvironmentProviders;

function provideServerRendering(...features: ServerRenderingFeature<ServerRenderingFeatureKind>[]): EnvironmentProviders;

Configures server-side rendering for an Angular application.

This function sets up the necessary providers for server-side rendering, including support for server routes and app shell. It combines features configured using withRoutes and withAppShell to provide a comprehensive server-side rendering setup.

@paramfeaturesServerRenderingFeature<ServerRenderingFeatureKind>[]

Optional features to configure additional server rendering behaviors.

@returnsEnvironmentProviders

An EnvironmentProviders instance with the server-side rendering configuration.

Usage notes

Basic example of how you can enable server-side rendering in your application when using the bootstrapApplication function:

import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser';
import { provideServerRendering, withRoutes, withAppShell } from '@angular/ssr';
import { AppComponent } from './app/app.component';
import { SERVER_ROUTES } from './app/app.server.routes';
import { AppShellComponent } from './app/app-shell.component';

const bootstrap = (context: BootstrapContext) =>
    bootstrapApplication(AppComponent, {
      providers: [
        provideServerRendering(
          withRoutes(SERVER_ROUTES),
          withAppShell(AppShellComponent),
        ),
      ],
    }, context);

export default bootstrap;

function provideServerRendering(options: ServerRenderingOptions, ...features: ServerRenderingFeature<ServerRenderingFeatureKind>[]): EnvironmentProviders;

Configures server-side rendering for an Angular application with additional options.

@paramoptionsServerRenderingOptions

Configuration options for server-side rendering.

@paramfeaturesServerRenderingFeature<ServerRenderingFeatureKind>[]

Optional features to configure additional server rendering behaviors.

@returnsEnvironmentProviders

An EnvironmentProviders instance with the server-side rendering configuration.

Usage notes

Basic example of how you can enable server-side rendering with options in your application when using the bootstrapApplication function:

import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser';
import { provideServerRendering, withRoutes, withAppShell } from '@angular/ssr';
import { AppComponent } from './app/app.component';
import { SERVER_ROUTES } from './app/app.server.routes';
import { AppShellComponent } from './app/app-shell.component';

const bootstrap = (context: BootstrapContext) =>
    bootstrapApplication(AppComponent, {
      providers: [
        provideServerRendering(
          { maxResponseBodySize: 1024 * 1024 }, // 1MB limit
          withRoutes(SERVER_ROUTES),
          withAppShell(AppShellComponent),
        ),
      ],
    }, context);

export default bootstrap;

Description

Configures server-side rendering for an Angular application.

Usage Notes

Basic example of how you can enable server-side rendering in your application when using the bootstrapApplication function:

import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser';
import { provideServerRendering, withRoutes, withAppShell } from '@angular/ssr';
import { AppComponent } from './app/app.component';
import { SERVER_ROUTES } from './app/app.server.routes';
import { AppShellComponent } from './app/app-shell.component';

const bootstrap = (context: BootstrapContext) =>
    bootstrapApplication(AppComponent, {
      providers: [
        provideServerRendering(
          withRoutes(SERVER_ROUTES),
          withAppShell(AppShellComponent),
        ),
      ],
    }, context);

export default bootstrap;