GetPicked
My sitesRun free audit

AI search readiness · Frameworks

Angular SEO and schema markup: SSR, prerendering and robots.txt

Angular renders in the browser by default, and Angular's own docs warn that client-side rendering may hurt SEO for pages crawlers index. Adding @angular/ssr gives you per-route server rendering or build-time prerendering. robots.txt, llms.txt and sitemaps are static files you add yourself, and JSON-LD has no built-in helper.

Edit robots.txt
PartlyNo generator. Put robots.txt in the public/ folder, which the Angular CLI copies to the build output by default.
XML sitemap
NoThe Angular docs describe no sitemap generator. Generate sitemap.xml at build time and ship it from public/.
llms.txt
PartlyAdd a static llms.txt to public/ so it is copied with the build.
AI crawlers
No AI-specific setting in Angular. With the default client-side rendering, AI crawlers that do not run JavaScript receive an almost empty page; use RenderMode.Server or RenderMode.Prerender for public routes.
Structured data
Angular outputs no structured data. The Meta and Title services manage meta tags; JSON-LD has to be added as a script element, rendered on the server so it is in the HTML.

Why rendering mode decides Angular's AI visibility

Angular's SSR guide lists three render modes. RenderMode.Client renders the application in the browser and is the default Angular behavior. RenderMode.Server renders on the server for each request and sends a fully populated HTML page. RenderMode.Prerender generates static HTML for each route at build time.

The docs say server rendering and prerendering generally have excellent SEO, while client-side rendering may negatively affect SEO for pages that crawlers index, because crawlers limit how much JavaScript they run. For AI crawlers the limit is stricter. Vercel's December 2024 study found that none of the major AI crawlers it tested render JavaScript, so GPTBot, ClaudeBot and PerplexityBot see only the initial HTML of a client-rendered Angular app. Google's Gemini was the exception, since it relies on Googlebot's renderer.

To turn on server rendering:

  1. New project: ng new --ssr.
  2. Existing project: ng add @angular/ssr.
  3. In app.routes.server.ts, map routes to render modes. Prerender marketing, docs and product pages; keep logged-in screens on RenderMode.Client if you like.

Prerendered routes produce plain HTML files, so they can be hosted on a static host. See the JavaScript SEO entry for how this fits with Google's rendering pipeline.

robots.txt, sitemap and llms.txt in Angular

Angular does not generate any of these files. Angular's workspace configuration copies the contents of the public/ directory into the build by default, so the simplest setup is:

  • public/robots.txt with your crawler rules and a Sitemap: line.
  • public/sitemap.xml, generated by a script that reads your route list before ng build. The Angular docs describe no built-in sitemap feature.
  • public/llms.txt, a short Markdown summary of the site following the llms.txt proposal.

Because these are static, they go stale when routes change. Wire the sitemap script into your build so new pages are always listed.

Adding schema markup (JSON-LD) in Angular

If you searched "angular schema" for the JSON schema used by angular.json or schematics, that is a separate topic; this section is about schema.org structured data.

Angular ships a Meta service for managing meta tags (addTag, updateTag) and a Title service, but nothing for JSON-LD. The usual approach is a small service that builds the schema.org object for the current page and appends a script element with type="application/ld+json" to the document head. Two points matter:

  • Render it on the server. If the route uses RenderMode.Client, the script only exists after the bundle runs, and crawlers that skip JavaScript never see it.
  • Replace, don't stack. On client-side navigation, remove the previous page's script before adding the next one, so a product page does not carry the last page's Product markup.

Start with Organization on the home page and Product, Article or FAQPage on the matching templates. After deploying, check the live HTML with View Source, not DevTools, and run the robots.txt checker to confirm AI crawlers are allowed in.

Check your Angular site

Paste your domain to see which AI crawlers your live robots.txt lets in.

robots.txt checker

Test your robots.txt against every AI crawler

robots.txt generator

Preset
robots.txt
# robots.txt generated with https://www.getpicked.app/tools/robots-txt-checker
# Preset: Allow AI search, block training

User-agent: *
Allow: /

# Model training crawlers
User-agent: GPTBot
User-agent: ClaudeBot
User-agent: Google-Extended
User-agent: Applebot-Extended
User-agent: Meta-ExternalAgent
User-agent: Amazonbot
User-agent: CCBot
User-agent: Bytespider
Disallow: /

Questions

Is Angular good for SEO?
With server rendering or prerendering, yes. Angular's docs say both generally have excellent SEO because crawlers receive a complete HTML document, and warn that the default client-side rendering may hurt SEO for pages that crawlers index.
How do I add SSR to an existing Angular app?
Run ng add @angular/ssr. For a new project, use ng new --ssr. Then set a render mode per route in app.routes.server.ts: RenderMode.Server, RenderMode.Prerender or RenderMode.Client.
How do I add schema markup to Angular?
Build a schema.org object and insert it as a script element of type application/ld+json from a component or service. It only reaches crawlers that skip JavaScript if the route is server-rendered or prerendered.
Where should robots.txt live in an Angular project?
In the public/ folder. Angular's workspace configuration copies the contents of public/ into the build output by default, so the file is served at /robots.txt.

Other frameworks

Related

Sources

Checked against these pages on 2026-10-19. Operators change their crawlers; check the source before relying on a detail.