@intlayer/docs 8.5.2 → 8.6.0

package/docs/pl/intlayer_with_svelte_kit.md

@@ -372,7 +372,7 @@ export default heroContent;
 <!-- Renderuj treść jako prostą zawartość -->
 <h1>{$content.title}</h1>
 <!-- Aby renderować treść edytowalną za pomocą edytora -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- Aby wyrenderować zawartość jako ciąg znaków -->
 <div aria-label={$content.title.value}></div>
 ```
@@ -728,7 +728,7 @@ Aby móc wizualizować selektor edytora intlayer, musisz użyć składni kompone
   <h1>{$content.title}</h1>
 
   <!-- Renderuj zawartość jako komponent (wymagane przez edytor) -->
-  <svelte:component this={$content.component} />
+  {@const Component = $content.component}<Component />
 </div>
 ```
 

package/docs/pl/intlayer_with_tanstack+solid.md

@@ -140,16 +140,12 @@ Dodaj wtyczkę intlayer do swojej konfiguracji:
 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]
-> W plikach Solid, `useMatches` zwraca **signal** (reaktywny akcesor). Użyj `matches()` (z nawiasami), aby reaktywnie uzyskać dostęp do aktualnej wartości.
-
 ### Krok 6: Utworzenie Layoutu Językowego (opcjonalnie)
 
 Utwórz layout, który obsługuje prefiks językowy i wykonuje walidację. Ten layout zapewni, że przetwarzane będą tylko prawidłowe języki.
@@ -415,7 +408,6 @@ function RouteComponent() {
 }
 ```
 
-> [!NOTE]
 > W Solidzie, `useIntlayer` zwraca funkcję **accessor** (np.: `content()`). Musisz wywołać tę funkcję, aby uzyskać dostęp do reaktywnej treści.
 >
 > Aby dowiedzieć się więcej o hooku `useIntlayer`, zapoznaj się z [dokumentacją](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pl/packages/solid-intlayer/useIntlayer.md).
@@ -460,7 +452,6 @@ export const LocaleSwitcher = () => {
 export default LocaleSwitcher;
 ```
 
-> [!NOTE]
 > W plikach Solid, `locale` z `useLocale` to **signal accessor**. Użyj `locale()` (z nawiasami), aby reaktywnie odczytać jego aktualną wartość.
 >
 > Aby dowiedzieć się więcej o hooku `useLocale`, zapoznaj się z [dokumentacją](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pl/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(), // Proxy powinno być umieszczone przed serwerem, jeśli używasz Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -803,16 +790,12 @@ Zaktualizuj swoje `vite.config.ts`, aby dołączyć wtyczkę `intlayerCompiler`:
 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/pl/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(), // Proxy powinno być umieszczone przed serwerem, jeśli używasz Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {

package/docs/pl/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > Gdy potrzebujesz przetłumaczonego ciągu znaków w natywnym atrybucie HTML (np. `alt`, `aria-label`, `title`), wywołaj `.value` na węźle typu liść (leaf node):
 >
 > ```typescript

package/docs/pl/intlayer_with_vite+solid.md

@@ -314,7 +314,6 @@ const App: Component = () => (
 export default App;
 ```
 
-> [!NOTE]
 > W Solid, `useIntlayer` zwraca funkcję **accessor** (np. `content()`). Musisz wywołać tę funkcję, aby uzyskać dostęp do reaktywnej zawartości.
 
 > Jeśli chcesz użyć swojej zawartości w atrybucie `string`, takim jak `alt`, `title`, `href`, `aria-label` itp., musisz wywołać wartość funkcji, jak:

package/docs/pl/intlayer_with_vite+svelte.md

@@ -233,7 +233,7 @@ module.exports = appContent;
 <!-- Renderuj zawartość jako prostą zawartość  -->
 <h1>{$content.title}</h1>
 <!-- Aby renderować zawartość edytowalną za pomocą edytora -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- Aby renderować zawartość jako ciąg znaków -->
 <div aria-label={$content.title.value}></div>
 ```

package/docs/pt/intlayer_with_react_router_v7.md

@@ -195,13 +195,12 @@ Adicione o plugin intlayer na sua configuração:
 import { reactRouter } from "@react-router/dev/vite";
 import { defineConfig } from "vite";
 import { intlayerProxy, intlayer } from "vite-intlayer";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   plugins: [
     intlayerProxy(), // should be placed first
     reactRouter(),
-    tsconfigPaths(),
+
     intlayer(),
   ],
 });

package/docs/pt/intlayer_with_react_router_v7_fs_routes.md

@@ -169,10 +169,9 @@ Adicione o plugin intlayer na sua configuração:
 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()],
 });
 ```
 
@@ -803,13 +802,12 @@ Você também pode usar o `intlayerProxy` para adicionar roteamento do lado do s
 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/pt/intlayer_with_svelte_kit.md

@@ -372,7 +372,7 @@ para acessar seu valor reativo (por exemplo, `$content.title`).
 <!-- Renderizar conteúdo como conteúdo simples  -->
 <h1>{$content.title}</h1>
 <!-- Para renderizar o conteúdo editável usando o editor -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- Para renderizar o conteúdo como uma string -->
 <div aria-label={$content.title.value}></div>
 ```
@@ -728,7 +728,7 @@ Para poder visualizar o seletor do editor intlayer, você deverá usar a sintaxe
   <h1>{$content.title}</h1>
 
   <!-- Renderizar conteúdo como um componente (requerido pelo editor) -->
-  <svelte:component this={$content.component} />
+  {@const Component = $content.component}<Component />
 </div>
 ```
 
@@ -760,7 +760,7 @@ Para poder visualizar o seletor do editor intlayer, você terá que usar a sinta
   <h1>{$content.title}</h1>
 
   <!-- Renderizar conteúdo como um componente (requerido pelo editor) -->
-  <svelte:component this={$content.component} />
+  {@const Component = $content.component}<Component />
 </div>
 ```
 

package/docs/pt/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 - Como traduzir uma aplicação Tanstack Start usando Solid.js em 2026
 description: Aprenda como adicionar internacionalização (i18n) à sua aplicação Tanstack Start usando Intlayer e Solid.js. Siga este guia completo para tornar sua aplicação multilíngue com roteamento ciente de localidade.
 keywords:
@@ -12,6 +12,7 @@ keywords:
   - i18n
   - TypeScript
   - Roteamento de Localidade
+  - Sitemap
 slugs:
   - doc
   - environment
@@ -140,16 +141,12 @@ Adicione o plugin intlayer na sua configuração:
 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]
-> No Solid, `useMatches` retorna um **signal** (acessador reativo). Use `matches()` (com parênteses) para acessar o valor atual de forma reativa.
-
 ### Passo 6: Criar o Layout de Localidade (Opcional)
 
 Crie um layout que lide com o prefixo de localidade e realize a validação. Este layout garantirá que apenas localidades válidas sejam processadas.
@@ -415,7 +409,6 @@ function RouteComponent() {
 }
 ```
 
-> [!NOTE]
 > No Solid, `useIntlayer` retorna uma função **accessor** (ex: `content()`). Você deve chamar esta função para acessar o conteúdo reativo.
 >
 > Para aprender mais sobre o hook `useIntlayer`, consulte a [documentação](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/packages/solid-intlayer/useIntlayer.md).
@@ -460,7 +453,6 @@ export const LocaleSwitcher = () => {
 export default LocaleSwitcher;
 ```
 
-> [!NOTE]
 > No Solid, `locale` de `useLocale` é um **signal accessor**. Use `locale()` (com parênteses) para ler o seu valor atual de forma reativa.
 >
 > Para aprender mais sobre o hook `useLocale`, consulte la [documentação](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/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(), // O proxy deve ser colocado antes do servidor se você usar o Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -662,7 +650,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
 });
 ```
 
-### (Opcional) Passo 16: Extrair o conteúdo dos seus componentes
+### (Opcional) Passo 15: Extrair o conteúdo dos seus componentes
 
 Se você tem uma base de código existente, transformar milhares de arquivos pode ser demorado.
 
@@ -803,16 +791,12 @@ Atualize o seu `vite.config.ts` para incluir o plugin `intlayerCompiler`:
 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 # Ou bun run dev
 
 ---
 
+### Passo 16: Gerar um Sitemap (Opcional)
+
+O Intlayer vem com um gerador de sitemap integrado para ajudá-lo a criar facilmente um sitemap para sua aplicação. Ele cuida das rotas localizadas e adiciona os metadados necessários para os mecanismos de busca.
+
+> O sitemap gerado pelo Intlayer suporta o namespace `xhtml:link` (Hreflang XML Extensions). Ao contrário dos geradores de sitemap padrão que apenas listam URLs brutos, o Intlayer cria automaticamente os links bidirecionais necessários entre todas as versões de idioma de uma página (por exemplo, `/about`, `/about?lang=fr` e `/about?lang=es`). Isso garante que os mecanismos de busca indexem e sirvam corretamente a versão de idioma certa para o público certo.
+
+Para usá-lo, você primeiro precisa configurar o seu `vite.config.ts` para habilitar a pré-renderização de suas rotas localizadas e desabilitar a geração de sitemap padrão do TanStack Start.
+
+```typescript fileName="vite.config.ts"
+import { localeMap, localeFlatMap } from "intlayer";
+// ... outras importações
+
+export const pathList = ["", "/about", "/404"];
+
+const localizedPages = localeFlatMap(({ urlPrefix }) =>
+  pathList.map((path) => ({
+    path: `${urlPrefix}${path}`,
+    prerender: {
+      enabled: true,
+    },
+  }))
+);
+
+export default defineConfig({
+  plugins: [
+    // ... outros plugins
+    tanstackStart({
+      // ... outras configurações
+      sitemap: {
+        enabled: false,
+      },
+      prerender: {
+        enabled: true,
+        crawlLinks: false,
+        concurrency: 10,
+      },
+      pages: localizedPages,
+    }),
+  ],
+});
+```
+
+Em seguida, crie uma rota `src/routes/sitemap[.]xml.ts` que use a função `generateSitemap`:
+
+```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" },
+        });
+      },
+    },
+  },
+});
+```
+
+---
+
 ### Passo 17: Configurar TypeScript (Opcional)
 
 O Intlayer usa a ampliação de módulo para obter os benefícios do TypeScript e tornar a sua base de código mais forte.

package/docs/pt/intlayer_with_tanstack.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-09
-updatedAt: 2026-03-12
+updatedAt: 2026-03-29
 title: Tanstack Start i18n - Como traduzir uma aplicação Tanstack Start em 2026
 description: Aprenda como adicionar internacionalização (i18n) à sua aplicação Tanstack Start usando Intlayer. Siga este guia completo para tornar seu app multilíngue com roteamento sensível ao locale.
 keywords:
@@ -12,6 +12,7 @@ keywords:
   - i18n
   - TypeScript
   - Roteamento por Locale
+  - 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: {
@@ -594,15 +591,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(), // O proxy deve ser colocado antes do servidor se você usar Nitro
     nitro(),
-    viteTsConfigPaths({
-      projects: ["./tsconfig.json"],
-    }),
     intlayer(),
     tanstackStart({
       router: {
@@ -754,27 +747,7 @@ export const Route = createFileRoute("/{-$locale}/$")({
 });
 ```
 
----
-
-### Passo 16: Configurar TypeScript (Opcional)
-
-O Intlayer utiliza a ampliação de módulos para aproveitar os benefícios do TypeScript e fortalecer sua base de código.
-
-Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente:
-
-```json5 fileName="tsconfig.json"
-{
-  // ... suas configurações existentes
-  include: [
-    // ... seus includes existentes
-    ".intlayer/**/*.ts", // Incluir os tipos gerados automaticamente
-  ],
-}
-```
-
----
-
-### (Opcional) Etapa 1 : Extrair o conteúdo dos seus componentes
+### (Opcional) Passo 15: Extrair o conteúdo dos seus componentes
 
 Se você tiver uma base de código existente, transformar milhares de arquivos pode ser demorado.
 
@@ -932,6 +905,99 @@ bun run build # Or bun run dev
 
 ---
 
+### Passo 16: Gerar um Sitemap (Opcional)
+
+O Intlayer vem com um gerador de sitemap integrado para ajudá-lo a criar facilmente um sitemap para sua aplicação. Ele cuida das rotas localizadas e adiciona os metadados necessários para os mecanismos de busca.
+
+> O sitemap gerado pelo Intlayer suporta o namespace `xhtml:link` (Hreflang XML Extensions). Ao contrário dos geradores de sitemap padrão que apenas listam URLs brutos, o Intlayer cria automaticamente os links bidirecionais necessários entre todas as versões de idioma de uma página (por exemplo, `/about`, `/about?lang=fr` e `/about?lang=es`). Isso garante que os mecanismos de busca indexem e sirvam corretamente a versão de idioma certa para o público certo.
+
+Para usá-lo, você primeiro precisa configurar o seu `vite.config.ts` para habilitar a pré-renderização de suas rotas localizadas e desabilitar a geração de sitemap padrão do TanStack Start.
+
+```typescript fileName="vite.config.ts"
+import { localeFlatMap } from "intlayer";
+// ... outras importações
+
+export const pathList = ["", "/about", "/404"];
+
+const localizedPages = localeFlatMap(({ urlPrefix }) =>
+  pathList.map((path) => ({
+    path: `${urlPrefix}${path}`,
+    prerender: {
+      enabled: true,
+    },
+  }))
+);
+
+export default defineConfig({
+  plugins: [
+    // ... outros plugins
+    tanstackStart({
+      // ... outras configurações
+      sitemap: {
+        enabled: false,
+      },
+      prerender: {
+        enabled: true,
+        crawlLinks: false,
+        concurrency: 10,
+      },
+      pages: localizedPages,
+    }),
+  ],
+});
+```
+
+Em seguida, crie uma rota `src/routes/sitemap[.]xml.ts` que use a função `generateSitemap`:
+
+```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" },
+        });
+      },
+    },
+  },
+});
+```
+
+---
+
+### Passo 17: Configurar TypeScript (Opcional)
+
+O Intlayer utiliza a ampliação de módulos para aproveitar os benefícios do TypeScript e fortalecer sua base de código.
+
+Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente:
+
+```json5 fileName="tsconfig.json"
+{
+  // ... suas configurações existentes
+  include: [
+    // ... seus includes existentes
+    ".intlayer/**/*.ts", // Incluir os tipos gerados automaticamente
+  ],
+}
+```
+
+---
+
 ### Configuração do Git
 
 É recomendado ignorar os arquivos gerados pelo Intlayer. Isso permite evitar que eles sejam comitados no seu repositório Git.

package/docs/pt/intlayer_with_vite+lit.md

@@ -409,7 +409,6 @@ export class MyElement extends LitElement {
 }
 ```
 
-> [!NOTE]
 > Quando precisar da string traduzida num atributo HTML nativo (ex: `alt`, `aria-label`, `title`), chame `.value` no nó folha:
 >
 > ```typescript

package/docs/pt/intlayer_with_vite+solid.md

@@ -312,7 +312,6 @@ const App: Component = () => (
 export default App;
 ```
 
-> [!NOTE]
 > No Solid, `useIntlayer` retorna uma função **accessor** (por exemplo, `content()`). Deve chamar esta função para aceder ao conteúdo reativo.
 
 > Se quiser usar o seu conteúdo num atributo `string`, como `alt`, `title`, `href`, `aria-label`, etc., deve chamar o valor da função, como:

package/docs/pt/intlayer_with_vite+svelte.md

@@ -232,7 +232,7 @@ module.exports = appContent;
 <!-- Renderizar conteúdo como conteúdo simples -->
 <h1>{$content.title}</h1>
 <!-- Para renderizar o conteúdo editável usando o editor -->
-<h1><svelte:component this={$content.title} /></h1>
+<h1>{@const Title = $content.title}<Title /></h1>
 <!-- Para renderizar o conteúdo como uma string -->
 <div aria-label={$content.title.value}></div>
 

package/docs/ru/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/ru/intlayer_with_react_router_v7_fs_routes.md

@@ -169,10 +169,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()],
 });
 ```
 
@@ -805,13 +804,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/ru/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>
 ```