From: Sebastián Ramírez <tiangolo@gmail.com>
Date: Sat, 20 Jun 2026 00:59:14 +0000 (+0200)
Subject: 📝 Add Frontend instructions to Agent Library Skill (#15805)
X-Git-Tag: 0.138.0~4
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=190f6e2033c8b886b25027be284d8c8c1893f28c;p=thirdparty%2Ffastapi%2Ffastapi.git

📝 Add Frontend instructions to Agent Library Skill (#15805)
---

diff --git a/fastapi/.agents/skills/fastapi/SKILL.md b/fastapi/.agents/skills/fastapi/SKILL.md
index d5f32fa3c4..f2ecd9eecb 100644
--- a/fastapi/.agents/skills/fastapi/SKILL.md
+++ b/fastapi/.agents/skills/fastapi/SKILL.md
@@ -288,6 +288,32 @@ There could be exceptions, but try to follow this convention.
 
 Apply shared dependencies at the router level via `dependencies=[Depends(...)]`.
 
+## Serve Frontend Apps
+
+Use `app.frontend()` to serve a built static frontend app, for example a directory generated by Vite, Astro, Angular, Svelte, Vue, or a similar tool.
+
+```python
+from fastapi import FastAPI
+
+app = FastAPI()
+
+app.frontend("/", directory="dist")
+```
+
+Use `router.frontend()` when the frontend belongs to an `APIRouter`; normal router prefix behavior applies when the router is included.
+
+```python
+from fastapi import APIRouter, FastAPI
+
+app = FastAPI()
+router = APIRouter(prefix="/admin")
+
+router.frontend("/", directory="admin-dist")
+app.include_router(router)
+```
+
+`app.frontend()` and `router.frontend()` are low-priority routes: regular API routes are matched first, then frontend files and client-side routing fallbacks. Use this for single-page apps and built frontend assets instead of mounting `StaticFiles` manually.
+
 ## Dependency Injection
 
 See [the dependency injection reference](references/dependencies.md) for detailed patterns including `yield` with `scope`, and class dependencies.