FASTANGANGULAR + FASTIFY0.1Server render
FASTANG / GUIDE

Configuration, plugins and environment

Extend the server with Fastify and keep public settings separate from backend secrets.

Register a hook

Replace src/server/plugins.ts with this file. The hook adds a header to every request handled by Fastify.

src/server/plugins.ts
import type { FastifyInstance } from 'fastify';

export async function configureServer(app: FastifyInstance): Promise<void> {
  app.addHook('onRequest', async (_request, reply) => {
    reply.header('x-app-name', process.env['APP_NAME'] ?? 'my-fastang-app');
  });
}

This entry is used by the Node server and Vercel API/SSR functions. Files served directly by Vercel's CDN do not pass through Fastify hooks. You can also use app.register() for Fastify 5 compatible plugins. Install additional plugins in your project: they are not included automatically.

Server variables

bash
PORT=4000 HOST=127.0.0.1 APP_NAME=my-app npm run dev

The example uses POSIX shell syntax. Supply variables through the shell or deployment platform. The alpha does not automatically load .env files into the Fastify process. PORT must be valid; the default port is 3278 and the default host is 127.0.0.1.

Vite's VITE_ variables are intended for the client and can enter the browser bundle. Do not use them for server secrets. Read server variables from process.env in APIs and plugins.

The two configuration files

fastang.config.ts contains explicit prerender URLs and Vercel adapter options. vite.config.ts uses defineFastangConfig() from @fastang/core/vite: this includes Angular compilation, route generation and the server/client boundary.

Do not import src/server code, .server.ts files or server runtime APIs into browser components. The bundle check rejects these imports even through another module. Shared types should live in modules that do not load server dependencies.

See Fastify hooks and Vite variables. Continue with deployment.