@intlayer/docs 8.5.2 → 8.6.0

package/docs/ar/intlayer_with_react_router_v7.md

@@ -174,10 +174,9 @@ module.exports = config;
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
-  plugins: [reactRouter(), tsconfigPaths(), intlayer()],
+  plugins: [reactRouter(), intlayer()],
 });
 ```
 
@@ -739,13 +738,12 @@ This comprehensive guide provides everything you need to integrate Intlayer with
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // should be placed first
     reactRouter(),
-    tsconfigPaths(),
+
     intlayer(),
   ],
 });

package/docs/ar/intlayer_with_react_router_v7_fs_routes.md

@@ -173,10 +173,9 @@ module.exports = config;
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
-  plugins: [reactRouter(), tsconfigPaths(), intlayer()],
+  plugins: [reactRouter(), intlayer()],
 });
 ```
 
@@ -686,13 +685,12 @@ This comprehensive guide provides everything you need to integrate Intlayer with
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // should be placed first
     reactRouter(),
-    tsconfigPaths(),
+
     intlayer(),
   ],
 });

package/docs/ar/intlayer_with_svelte_kit.md

@@ -370,7 +370,7 @@ export default heroContent;
 <!-- عرض المحتوى كمحتوى بسيط -->
 <h1>{$content.title}</h1>
 <!-- لعرض المحتوى قابل للتحرير باستخدام المحرر -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- لعرض المحتوى كنص -->
 <div aria-label={$content.title.value}></div>
 ```
@@ -726,7 +726,7 @@ export default defineConfig({
   <h1>{$content.title}</h1>
 
   <!-- عرض المحتوى كمكون (مطلوب من قبل المحرر) -->
-  <svelte:component this={$content.component} />
+  {@const Component = $content.component}<Component />
 </div>
 ```
 

package/docs/ar/intlayer_with_tanstack+solid.md

@@ -140,16 +140,12 @@ export default config;
 import { intlayer } from "vite-intlayer";
 import { defineConfig } from "vite";
 import { devtools } from "@tanstack/devtools-vite";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
 import solidPlugin from "vite-plugin-solid";
 
 export default defineConfig({
   plugins: [
     devtools(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     tanstackStart({
       router: {
         routeFileIgnorePattern:
@@ -221,9 +217,6 @@ function RootComponent() {
 }
 ```
 
-> [!NOTE]
-> في ملفات Solid، يعيد `useMatches` **إشارة (signal)** (وصول تفاعلي). استخدم `matches()` (مع القوسين) للوصول إلى القيمة الحالية بشكل تفاعلي.
-
 ### الخطوة 6: إنشاء تخطيط اللغة (اختياري)
 
 أنشئ تخطيطًا يتعامل مع بادئة اللغة ويقوم بالتحقق من صحتها. سيضمن هذا التخطيط معالجة اللغات الصالحة فقط.
@@ -415,7 +408,6 @@ function RouteComponent() {
 }
 ```
 
-> [!NOTE]
 > في Solid، يعيد `useIntlayer` وظيفة **وصول (accessor)** (مثل `content()`). يجب عليك استدعاء هذه الوظيفة للوصول إلى المحتوى التفاعلي.
 >
 > لمعرفة المزيد حول خطاف `useIntlayer` ، راجع [التوثيق](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/packages/solid-intlayer/useIntlayer.md).
@@ -460,7 +452,6 @@ export const LocaleSwitcher = () => {
 export default LocaleSwitcher;
 ```
 
-> [!NOTE]
 > في ملفات Solid ، يكون `locale` من `useLocale` عبارة عن **signal accessor**. استخدم `locale()` (مع القوسين) لقراءة قيمته الحالية بشكل تفاعلي.
 >
 > لمعرفة المزيد حول خطاف `useLocale` ، راجع [التوثيق](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/packages/solid-intlayer/useLocale.md).
@@ -502,15 +493,11 @@ import solid from "vite-plugin-solid";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // يجب وضع الوكيل قبل الخادم إذا كنت تستخدم Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -803,16 +790,12 @@ bun x intlayer extract
 import { intlayer, intlayerCompiler } from "vite-intlayer";
 import { defineConfig } from "vite";
 import { devtools } from "@tanstack/devtools-vite";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
 import solidPlugin from "vite-plugin-solid";
 
 export default defineConfig({
   plugins: [
     devtools(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     tanstackStart({
       router: {
         routeFileIgnorePattern:

package/docs/ar/intlayer_with_tanstack.md

@@ -160,14 +160,10 @@ import viteReact from "@vitejs/plugin-react";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 const config = defineConfig({
   plugins: [
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -593,15 +589,11 @@ import viteReact from "@vitejs/plugin-react";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // يجب وضع البروكسي قبل الخادم إذا كنت تستخدم Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {

package/docs/ar/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > عندما تحتاج إلى السلسلة المترجمة في سمة HTML أصلية (مثل `alt` أو `aria-label` أو `title`)، استدعِ `.value` على العقدة الطرفية:
 >
 > ```typescript

package/docs/ar/intlayer_with_vite+solid.md

@@ -315,7 +315,6 @@ const App: Component = () => (
 export default App;
 ```
 
-> [!NOTE]
 > في Solid، `useIntlayer` يُرجع دالة **accessor** (على سبيل المثال، `content()`). يجب عليك استدعاء هذه الدالة للوصول إلى المحتوى التفاعلي.
 
 > إذا كنت تريد استخدام المحتوى الخاص بك في سمة `string`، مثل `alt`، `title`، `href`، `aria-label`، إلخ، يجب عليك استدعاء قيمة الدالة، مثل:

package/docs/ar/intlayer_with_vite+svelte.md

@@ -232,7 +232,7 @@ module.exports = appContent;
 <!-- عرض المحتوى كمحتوى بسيط -->
 <h1>{$content.title}</h1>
 <!-- لعرض المحتوى قابل للتحرير باستخدام المحرر -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- لعرض المحتوى كسلسلة نصية -->
 <div aria-label={$content.title.value}></div>
 ```

package/docs/bn/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > যখন আপনার নেটিভ HTML অ্যাট্রিবিউটে (যেমন `alt`, `aria-label`, `title`) অনুবাদ করা স্ট্রিং প্রয়োজন হয়, তখন লিফ নোডে (leaf node) `.value` কল করুন:
 >
 > ```typescript

package/docs/cs/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > Když potřebujete přeložený řetězec v nativním HTML atributu (např. `alt`, `aria-label`, `title`), zavolejte `.value` na koncovém uzlu (leaf node):
 >
 > ```typescript

package/docs/de/intlayer_with_react_router_v7.md

@@ -174,10 +174,9 @@ Fügen Sie das Intlayer-Plugin in Ihre Konfiguration ein:
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
-  plugins: [reactRouter(), tsconfigPaths(), intlayer()],
+  plugins: [reactRouter(), intlayer()],
 });
 ```
 
@@ -739,13 +738,12 @@ Sie können auch das `intlayerProxy` verwenden, um serverseitiges Routing zu Ihr
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // should be placed first
     reactRouter(),
-    tsconfigPaths(),
+
     intlayer(),
   ],
 });

package/docs/de/intlayer_with_react_router_v7_fs_routes.md

@@ -155,13 +155,12 @@ Sie können auch das `intlayerProxy` verwenden, um serverseitiges Routing zu Ihr
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // should be placed first
     reactRouter(),
-    tsconfigPaths(),
+
     intlayer(),
   ],
 });

package/docs/de/intlayer_with_svelte_kit.md

@@ -370,7 +370,7 @@ export default heroContent;
 <!-- Inhalt als einfachen Inhalt rendern -->
 <h1>{$content.title}</h1>
 <!-- Um den Inhalt mit dem Editor bearbeitbar zu rendern -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- Um den Inhalt als String darzustellen -->
 <div aria-label={$content.title.value}></div>
 ```
@@ -726,7 +726,7 @@ Um den Intlayer-Editor-Selektor visualisieren zu können, müssen Sie die Kompon
   <h1>{$content.title}</h1>
 
   <!-- Inhalt als Komponente rendern (vom Editor erforderlich) -->
-  <svelte:component this={$content.component} />
+  {@const Component = $content.component}<Component />
 </div>
 ```
 

package/docs/de/intlayer_with_tanstack+solid.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-03-25
-updatedAt: 2026-03-25
+updatedAt: 2026-03-29
 title: i18n Tanstack Start - Wie man eine Tanstack Start Anwendung mit Solid.js im Jahr 2026 übersetzt
 description: Erfahren Sie, wie Sie Internationalisierung (i18n) zu Ihrer Tanstack Start Anwendung mit Intlayer und Solid.js hinzufügen. Folgen Sie diesem umfassenden Leitfaden, um Ihre App mit lokalisierungsbewusstem Routing mehrsprachig zu gestalten.
 keywords:
@@ -12,6 +12,7 @@ keywords:
   - i18n
   - TypeScript
   - Lokalisierungs-Routing
+  - Sitemap
 slugs:
   - doc
   - environment
@@ -140,16 +141,12 @@ Fügen Sie das Intlayer-Plugin zu Ihrer Konfiguration hinzu:
 import { intlayer } from "vite-intlayer";
 import { defineConfig } from "vite";
 import { devtools } from "@tanstack/devtools-vite";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
 import solidPlugin from "vite-plugin-solid";
 
 export default defineConfig({
   plugins: [
     devtools(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     tanstackStart({
       router: {
         routeFileIgnorePattern:
@@ -221,9 +218,6 @@ function RootComponent() {
 }
 ```
 
-> [!NOTE]
-> In Solid gibt `useMatches` ein **Signal** (reaktiver Accessor) zurück. Verwenden Sie `matches()` (mit Klammern), um reaktiv auf den aktuellen Wert zuzugreifen.
-
 ### Schritt 6: Gebietsschema-Layout erstellen (Optional)
 
 Erstellen Sie ein Layout, das das Gebietskennungs-Präfix verarbeitet und Validierungen durchführt. Dieses Layout stellt sicher, dass nur gültige Gebietsschemata verarbeitet werden.
@@ -415,7 +409,6 @@ function RouteComponent() {
 }
 ```
 
-> [!NOTE]
 > In Solid gibt `useIntlayer` eine **Accessor-Funktion** zurück (z. B. `content()`). Sie müssen diese Funktion aufrufen, um auf den reaktiven Inhalt zuzugreifen.
 >
 > Um mehr über den `useIntlayer`-Hook zu erfahren, lesen Sie die [Dokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/de/packages/solid-intlayer/useIntlayer.md).
@@ -460,7 +453,6 @@ export const LocaleSwitcher = () => {
 export default LocaleSwitcher;
 ```
 
-> [!NOTE]
 > In Solid ist `locale` aus `useLocale` ein **Signal-Accessor**. Verwenden Sie `locale()` (mit Klammern), um den aktuellen Wert reaktiv zu lesen.
 >
 > Um mehr über den `useLocale`-Hook zu erfahren, lesen Sie die [Dokumentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/de/packages/solid-intlayer/useLocale.md).
@@ -502,15 +494,11 @@ import solid from "vite-plugin-solid";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // Der Proxy sollte vor dem Server platziert werden, wenn Sie Nitro verwenden
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -551,7 +539,7 @@ export const Route = createFileRoute("/{-$locale}/")({
 
 ---
 
-### Schritt 14: Gebietsschema in Ihren Server-Aktionen abrufen (Optional)
+### Schritt 13: Gebietsschema in Ihren Server-Aktionen abrufen (Optional)
 
 Möglicherweise möchten Sie auf das aktuelle Gebietsschema innerhalb Ihrer Server-Aktionen oder API-Endpunkte zugreifen.
 Dies können Sie mit dem Helfer `getLocale` von `intlayer` tun.
@@ -588,7 +576,7 @@ export const getLocaleServer = createServerFn().handler(async () => {
 
 ---
 
-### Schritt 15: Nicht gefundene Seiten verwalten (Optional)
+### Schritt 14: Nicht gefundene Seiten verwalten (Optional)
 
 Wenn ein Benutzer eine nicht existierende Seite besucht, können Sie eine benutzerdefinierte 404-Seite anzeigen, und das Sprachpräfix kann beeinflussen, wie die 404-Seite ausgelöst wird.
 
@@ -662,7 +650,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
 });
 ```
 
-### (Optional) Schritt 16: Den Inhalt Ihrer Komponenten extrahieren
+### (Optional) Schritt 15: Den Inhalt Ihrer Komponenten extrahieren
 
 Wenn Sie eine bestehende Codebasis haben, kann die Transformation von Tausenden von Dateien zeitaufwendig sein.
 
@@ -803,16 +791,12 @@ Aktualisieren Sie Ihre `vite.config.ts`, um das `intlayerCompiler`-Plugin einzub
 import { intlayer, intlayerCompiler } from "vite-intlayer";
 import { defineConfig } from "vite";
 import { devtools } from "@tanstack/devtools-vite";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
 import solidPlugin from "vite-plugin-solid";
 
 export default defineConfig({
   plugins: [
     devtools(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     tanstackStart({
       router: {
         routeFileIgnorePattern:
@@ -847,6 +831,81 @@ bun run build # Oder bun run dev
 
 ---
 
+### Schritt 16: Sitemap generieren (Optional)
+
+Intlayer wird mit einem integrierten Sitemap-Generator geliefert, mit dem Sie ganz einfach eine Sitemap für Ihre Anwendung erstellen können. Er berücksichtigt lokalisierte Routen und fügt die erforderlichen Metadaten für Suchmaschinen hinzu.
+
+> Die von Intlayer generierte Sitemap unterstützt den `xhtml:link`-Namespace (Hreflang XML-Erweiterungen). Im Gegensatz zu Standard-Sitemap-Generatoren, die nur rohe URLs auflisten, erstellt Intlayer automatisch die erforderlichen bidirektionalen Links zwischen allen Sprachversionen einer Seite (z. B. `/about`, `/about?lang=fr` und `/about?lang=es`). Dies stellt sicher, dass Suchmaschinen die richtige Sprachversion korrekt indexieren und der richtigen Zielgruppe bereitstellen.
+
+Um ihn zu verwenden, müssen Sie zuerst Ihre `vite.config.ts` konfigurieren, um das Vorrendern für Ihre lokalisierten Routen zu aktivieren und die standardmäßige TanStack Start Sitemap-Generierung zu deaktivieren.
+
+```typescript fileName="vite.config.ts"
+import { localeMap, localeFlatMap } from "intlayer";
+// ... andere Imports
+
+export const pathList = ["", "/about", "/404"];
+
+const localizedPages = localeFlatMap(({ urlPrefix }) =>
+  pathList.map((path) => ({
+    path: `${urlPrefix}${path}`,
+    prerender: {
+      enabled: true,
+    },
+  }))
+);
+
+export default defineConfig({
+  plugins: [
+    // ... andere Plugins
+    tanstackStart({
+      // ... andere Konfigurationen
+      sitemap: {
+        enabled: false,
+      },
+      prerender: {
+        enabled: true,
+        crawlLinks: false,
+        concurrency: 10,
+      },
+      pages: localizedPages,
+    }),
+  ],
+});
+```
+
+Erstellen Sie dann eine Route `src/routes/sitemap[.]xml.ts`, die die Funktion `generateSitemap` verwendet:
+
+```typescript fileName="src/routes/sitemap[.]xml.ts"
+import { createFileRoute } from "@tanstack/solid-router";
+import { generateSitemap } from "intlayer";
+
+const SITE_URL = (
+  import.meta.env.VITE_SITE_URL ?? "http://localhost:3000"
+).replace(/\/$/, "");
+
+export const Route = createFileRoute("/sitemap.xml")({
+  server: {
+    handlers: {
+      GET: async () => {
+        const sitemap = generateSitemap(
+          [
+            { path: "/", changefreq: "daily", priority: 1.0 },
+            { path: "/about", changefreq: "monthly", priority: 0.8 },
+          ],
+          { siteUrl: SITE_URL }
+        );
+
+        return new Response(sitemap, {
+          headers: { "Content-Type": "application/xml" },
+        });
+      },
+    },
+  },
+});
+```
+
+---
+
 ### Schritt 17: TypeScript konfigurieren (Optional)
 
 Intlayer verwendet Modul-Augmentation, um die Vorteile von TypeScript zu nutzen und Ihre Codebasis robuster zu machen.

package/docs/de/intlayer_with_tanstack.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-09
-updatedAt: 2026-03-12
+updatedAt: 2026-03-29
 title: Tanstack Start i18n - Wie Sie eine Tanstack Start App übersetzen in 2026
 description: Erfahren Sie, wie Sie Internationalisierung (i18n) zu Ihrer Tanstack Start-Anwendung mit Intlayer hinzufügen. Folgen Sie dieser umfassenden Anleitung, um Ihre App mehrsprachig mit lokalisierungsbewusstem Routing zu machen.
 keywords:
@@ -12,6 +12,7 @@ keywords:
   - i18n
   - TypeScript
   - Lokalisierungs-Routing
+  - Sitemap
 slugs:
   - doc
   - environment
@@ -160,14 +161,10 @@ import viteReact from "@vitejs/plugin-react";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 const config = defineConfig({
   plugins: [
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -593,15 +590,11 @@ import viteReact from "@vitejs/plugin-react";
 import { nitro } from "nitro/vite";
 import { defineConfig } from "vite";
 import { intlayer, intlayerProxy } from "vite-intlayer";
-import viteTsConfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // Der Proxy sollte vor dem Server platziert werden, wenn Sie Nitro verwenden
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -755,25 +748,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
 
 ---
 
-### Schritt 15: TypeScript konfigurieren (Optional)
-
-Intlayer verwendet Module Augmentation, um die Vorteile von TypeScript zu nutzen und Ihre Codebasis robuster zu machen.
-
-Stellen Sie sicher, dass Ihre TypeScript-Konfiguration die automatisch generierten Typen enthält:
-
-```json5 fileName="tsconfig.json"
-{
-  // ... Ihre bestehenden Konfigurationen
-  include: [
-    // ... Ihre bestehenden Includes
-    ".intlayer/**/*.ts", // Die automatisch generierten Typen einschließen
-  ],
-}
-```
-
----
-
-### (Optional) Schritt 16 : Inhalt Ihrer Komponenten extrahieren
+### (Optional) Schritt 15 : Inhalt Ihrer Komponenten extrahieren
 
 Wenn Sie eine bestehende Codebasis haben, kann die Transformation von Tausenden von Dateien zeitaufwendig sein.
 
@@ -931,6 +906,99 @@ bun run build # Or bun run dev
 
 ---
 
+### Schritt 16: Sitemap generieren (Optional)
+
+Intlayer wird mit einem integrierten Sitemap-Generator geliefert, mit dem Sie ganz einfach eine Sitemap für Ihre Anwendung erstellen können. Er berücksichtigt lokalisierte Routen und fügt die erforderlichen Metadaten für Suchmaschinen hinzu.
+
+> Die von Intlayer generierte Sitemap unterstützt den `xhtml:link`-Namespace (Hreflang XML-Erweiterungen). Im Gegensatz zu Standard-Sitemap-Generatoren, die nur rohe URLs auflisten, erstellt Intlayer automatisch die erforderlichen bidirektionalen Links zwischen allen Sprachversionen einer Seite (z. B. `/about`, `/about?lang=fr` und `/about?lang=es`). Dies stellt sicher, dass Suchmaschinen die richtige Sprachversion korrekt indexieren und der richtigen Zielgruppe bereitstellen.
+
+Um ihn zu verwenden, müssen Sie zuerst Ihre `vite.config.ts` konfigurieren, um das Vorrendern für Ihre lokalisierten Routen zu aktivieren und die standardmäßige TanStack Start Sitemap-Generierung zu deaktivieren.
+
+```typescript fileName="vite.config.ts"
+import { localeFlatMap } from "intlayer";
+// ... andere Imports
+
+export const pathList = ["", "/about", "/404"];
+
+const localizedPages = localeFlatMap(({ urlPrefix }) =>
+  pathList.map((path) => ({
+    path: `${urlPrefix}${path}`,
+    prerender: {
+      enabled: true,
+    },
+  }))
+);
+
+export default defineConfig({
+  plugins: [
+    // ... andere Plugins
+    tanstackStart({
+      // ... andere Konfigurationen
+      sitemap: {
+        enabled: false,
+      },
+      prerender: {
+        enabled: true,
+        crawlLinks: false,
+        concurrency: 10,
+      },
+      pages: localizedPages,
+    }),
+  ],
+});
+```
+
+Erstellen Sie dann eine Route `src/routes/sitemap[.]xml.ts`, die die Funktion `generateSitemap` verwendet:
+
+```typescript fileName="src/routes/sitemap[.]xml.ts"
+import { createFileRoute } from "@tanstack/react-router";
+import { generateSitemap } from "intlayer";
+
+const SITE_URL = (
+  import.meta.env.VITE_SITE_URL ?? "http://localhost:3000"
+).replace(/\/$/, "");
+
+export const Route = createFileRoute("/sitemap.xml")({
+  server: {
+    handlers: {
+      GET: async () => {
+        const sitemap = generateSitemap(
+          [
+            { path: "/", changefreq: "daily", priority: 1.0 },
+            { path: "/about", changefreq: "monthly", priority: 0.8 },
+          ],
+          { siteUrl: SITE_URL }
+        );
+
+        return new Response(sitemap, {
+          headers: { "Content-Type": "application/xml" },
+        });
+      },
+    },
+  },
+});
+```
+
+---
+
+### Schritt 17: TypeScript konfigurieren (Optional)
+
+Intlayer verwendet Module Augmentation, um die Vorteile von TypeScript zu nutzen und Ihre Codebasis robuster zu machen.
+
+Stellen Sie sicher, dass Ihre TypeScript-Konfiguration die automatisch generierten Typen enthält:
+
+```json5 fileName="tsconfig.json"
+{
+  // ... Ihre bestehenden Konfigurationen
+  include: [
+    // ... Ihre bestehenden Includes
+    ".intlayer/**/*.ts", // Die automatisch generierten Typen einschließen
+  ],
+}
+```
+
+---
+
 ### Git-Konfiguration
 
 Es wird empfohlen, die von Intlayer generierten Dateien zu ignorieren. So vermeiden Sie, dass diese in Ihr Git-Repository übertragen werden.

package/docs/de/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > Wenn Sie den übersetzten String in einem nativen HTML-Attribut benötigen (z. B. `alt`, `aria-label`, `title`), rufen Sie `.value` auf dem Blattknoten auf:
 >
 > ```typescript

package/docs/de/intlayer_with_vite+solid.md

@@ -316,7 +316,6 @@ const App: Component = () => (
 export default App;
 ```
 
-> [!NOTE]
 > In Solid gibt `useIntlayer` eine **Accessor**-Funktion zurück (z. B. `content()`). Sie müssen diese Funktion aufrufen, um auf den reaktiven Inhalt zuzugreifen.
 
 > Wenn Sie Ihren Inhalt in einem `string`-Attribut verwenden möchten, wie `alt`, `title`, `href`, `aria-label` usw., müssen Sie den Wert der Funktion aufrufen, wie: