@intlayer/docs 9.5.5 → 9.5.7

package/docs/ja/intlayer_with_astro_solid.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-21
 title: "Astro + Solid i18n - あなたのアプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）Astro + Solidアプリを構築するためのガイド。AIエージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -19,6 +19,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-astro-template
 applicationShowcase: https://intlayer-astro-template.vercel.app
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "Astro ページでの astro-intlayer の useIntlayer / useLocale フックの使用"
   - version: 8.9.0
     date: 2026-05-04
     changes: "Solid の useIntlayer API の使用法を直接プロパティアクセスに更新"
@@ -150,7 +153,7 @@ bun add intlayer astro-intlayer solid-js solid-intlayer @astrojs/solid-js
   設定管理、翻訳、[コンテンツ宣言](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/dictionary/content_file.md)、トランスパイル、および[CLIコマンド](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/cli/index.md)のための国際化ツールを提供するコアパッケージ。
 
 - **astro-intlayer**
-  Intlayerを[Viteバンドラー](https://vite.dev/guide/why.html#why-bundle-for-production)と統合するためのAstro統合プラグイン、およびユーザーの優先ロケールの検出、クッキーの管理、URLリダイレクトの処理を行うミドルウェアが含まれています。
+  Intlayer を [Vite バンドラー](https://vite.dev/guide/why.html#why-bundle-for-production) と統合する Astro 統合プラグイン、各リクエストのロケールを `Astro.locals.intlayer` に解決するミドルウェア、および `useIntlayer` / `useDictionary` / `useLocale` フックが含まれています。同じインポートパスが `.astro` フロントマターのサーバー実装と `<script>` ブロック内のクライアント実装（`vanilla-intlayer` ベース）に解決されます。
 
 - **solid-js**
   コアSolidパッケージ。
@@ -164,6 +167,31 @@ bun add intlayer astro-intlayer solid-js solid-intlayer @astrojs/solid-js
 </Step>
 <Step number={2} title="プロジェクトの設定">
 
+### アーキテクチャ
+
+このアーキテクチャでは、`astro.config.ts` に登録された `intlayer()` 統合が辞書をビルドし、各リクエストのロケールを解決して `Astro.locals.intlayer` に公開するミドルウェアを追加します。ページは `src/pages/[...locale]/` レストセグメントの下に配置されるため、デフォルトロケールはプレフィックスなしで提供され、他のすべてのロケールには専用の URL が割り当てられます。`.astro` ファイルはサーバーレンダリング用に `astro-intlayer` の `useIntlayer` / `useLocale` フックを使用してコンテンツを読み取り、Solid アイランド (`src/components/solid/SolidIsland.tsx`) はサーバーで検出されたロケールを prop として受け取り、インタラクティブ部分のために `solid-intlayer` に渡します。コンテンツ宣言は `src/` 内のコンポーネントと一緒に配置されます。
+
+```bash
+.
+├── src
+│   ├── app.content.tsx               # App content declaration
+│   ├── components
+│   │   └── solid
+│   │       ├── LocaleSwitcher.tsx    # Locale switcher rendered inside the island
+│   │       └── SolidIsland.tsx       # Solid island wrapping the tree in IntlayerProvider
+│   └── pages
+│       ├── [...locale]
+│       │   └── index.astro           # Localized page mounting the island
+│       ├── robots.txt.ts             # robots.txt endpoint
+│       └── sitemap.xml.ts            # Localized sitemap endpoint
+├── astro.config.ts                   # Astro config with the intlayer() and solid() integrations
+├── intlayer.config.ts
+├── package.json
+└── tsconfig.json
+```
+
+### 設定
+
 アプリケーションの言語を設定するための設定ファイルを作成します：
 
 ```typescript fileName="intlayer.config.ts"
@@ -238,19 +266,21 @@ export default appContent;
 </Step>
 <Step number={5} title="Astroでのコンテンツの使用">
 
-`intlayer`からエクスポートされたコアヘルパーを使用して、`.astro`ファイル内で直接辞書を消費できます。また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにSolidアイランドを組み込む必要があります。
+`astro-intlayer` がエクスポートするフックを使用して、`.astro` ファイルで辞書を利用します。これらは `react-intlayer` と同じシグネチャを共有しており、`useIntlayer("key")` は辞書の内容を返し、`useLocale()` は現在のロケールを引数なしで返します。
+
+ロケールは `astro-intlayer` ミドルウェアから取得されます。このミドルウェアは独自の `src/middleware.ts` の前に登録され、各リクエストについて URL プレフィックス、クライアントが保持するロケール（Cookie またはヘッダー）、`Accept-Language` の順に解決し、`Astro.locals.intlayer` に保存します。事前レンダリングされたページは訪問者ごとに一度だけレンダリングされるため、URL のみを使用します。
+
+また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにSolidアイランドを組み込む必要があります。
 
 ```astro fileName="src/pages/[...locale]/index.astro"
 ---
+import { useIntlayer, useLocale } from "astro-intlayer";
 import {
-  getIntlayer,
-  getLocaleFromPath,
   getLocalizedUrl,
-  getHTMLTextDir,
   getPrefix,
   localeMap,
   defaultLocale,
-  type LocalesValues,
+  getHTMLTextDir,
 } from "intlayer";
 import { SolidIsland } from "../../components/solid/SolidIsland";
 
@@ -260,8 +290,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// ミドルウェアによって解決されたロケール（例: /ja/about -> 'ja'）
+const { locale } = useLocale();
+
+// そのロケールの 'app' 辞書の内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -317,6 +350,8 @@ const { title } = getIntlayer("app", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` は、独自のミドルウェアやエンドポイントにも `locale`、`defaultLocale`、`availableLocales` を公開します。第2引数としてロケールまたはセレクターを渡すことで（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）、1回の呼び出しに対してリクエストロケールを上書きできます。
+
 > **ルーティング設定に関する注意:**
 > 使用するディレクトリ構造は、`intlayer.config.ts` の `middleware.routing` 設定によります：
 >
@@ -433,10 +468,10 @@ const pathList: SitemapUrlEntry[] = [
   { path: "/about", changefreq: "monthly", priority: 0.7 },
 ];
 
-const SITE_URL = import.meta.env.SITE ?? "http://localhost:4321";
-
 export const GET: APIRoute = async ({ site }) => {
-  const xmlOutput = generateSitemap(pathList, { siteUrl: SITE_URL });
+  const xmlOutput = generateSitemap(pathList, {
+    siteUrl: "https://example.com",
+  });
 
   return new Response(xmlOutput, {
     headers: { "Content-Type": "application/xml" },
@@ -540,21 +575,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel compiler'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-Update your `vite.config.ts` to include the `intlayerCompiler` plugin:
-
-```ts fileName="vite.config.ts"
-import { defineConfig } from "vite";
-import { intlayer, intlayerCompiler } from "vite-intlayer";
-
-export default defineConfig({
-  plugins: [
-    intlayer(),
-    intlayerCompiler(), // Adds the compiler plugin
-  ],
-});
-```
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
 
 ```bash packageManager="npm"
 npm run build # Or npm run dev

package/docs/ja/intlayer_with_astro_svelte.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-21
 title: "Astro + Svelte i18n - あなたのアプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）Astro + Svelteアプリを構築するためのガイド。AIエージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -19,6 +19,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-astro-template
 applicationShowcase: https://intlayer-astro-template.vercel.app
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "Astro ページでの astro-intlayer の useIntlayer / useLocale フックの使用"
   - version: 8.9.0
     date: 2026-05-04
     changes: "Solid の useIntlayer API の使用法を直接プロパティアクセスに更新"
@@ -150,7 +153,7 @@ bun add intlayer astro-intlayer svelte svelte-intlayer @astrojs/svelte
   設定管理、翻訳、[コンテンツ宣言](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/dictionary/content_file.md)、トランスパイル、および[CLIコマンド](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/cli/index.md)のための国際化ツールを提供するコアパッケージ。
 
 - **astro-intlayer**
-  Intlayerを[Viteバンドラー](https://vite.dev/guide/why.html#why-bundle-for-production)と統合するためのAstro統合プラグイン、およびユーザーの優先ロケールの検出、クッキーの管理、URLリダイレクトの処理を行うミドルウェアが含まれています。
+  Intlayer を [Vite バンドラー](https://vite.dev/guide/why.html#why-bundle-for-production) と統合する Astro 統合プラグイン、各リクエストのロケールを `Astro.locals.intlayer` に解決するミドルウェア、および `useIntlayer` / `useDictionary` / `useLocale` フックが含まれています。同じインポートパスが `.astro` フロントマターのサーバー実装と `<script>` ブロック内のクライアント実装（`vanilla-intlayer` ベース）に解決されます。
 
 - **svelte**
   コアSvelteパッケージ。
@@ -164,6 +167,30 @@ bun add intlayer astro-intlayer svelte svelte-intlayer @astrojs/svelte
 </Step>
 <Step number={2} title="プロジェクトの設定">
 
+### アーキテクチャ
+
+このアーキテクチャでは、`astro.config.ts` に登録された `intlayer()` 統合が辞書をビルドし、各リクエストのロケールを解決して `Astro.locals.intlayer` に公開するミドルウェアを追加します。ページは `src/pages/[...locale]/` レストセグメントの下に配置されるため、デフォルトロケールはプレフィックスなしで提供され、他のすべてのロケールには専用の URL が割り当てられます。`.astro` ファイルはサーバーレンダリング用に `astro-intlayer` の `useIntlayer` / `useLocale` フックを使用してコンテンツを読み取り、Svelte アイランド (`src/components/svelte/SvelteIsland.svelte`) はサーバーで検出されたロケールを prop として受け取り、インタラクティブ部分のために `svelte-intlayer` に渡します。コンテンツ宣言は `src/` 内のコンポーネントと一緒に配置されます。
+
+```bash
+.
+├── src
+│   ├── app.content.ts                # App content declaration
+│   ├── components
+│   │   └── svelte
+│   │       └── SvelteIsland.svelte   # Svelte island (content + locale switcher)
+│   └── pages
+│       ├── [...locale]
+│       │   └── index.astro           # Localized page mounting the island
+│       ├── robots.txt.ts             # robots.txt endpoint
+│       └── sitemap.xml.ts            # Localized sitemap endpoint
+├── astro.config.ts                   # Astro config with the intlayer() and svelte() integrations
+├── intlayer.config.ts
+├── package.json
+└── tsconfig.json
+```
+
+### 設定
+
 アプリケーションの言語を設定するための設定ファイルを作成します：
 
 ```typescript fileName="intlayer.config.ts"
@@ -238,19 +265,21 @@ export default appContent;
 </Step>
 <Step number={5} title="Astroでのコンテンツの使用">
 
-`intlayer`からエクスポートされたコアヘルパーを使用して、`.astro`ファイル内で直接辞書を消費できます。また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにSvelteアイランドを組み込む必要があります。
+`astro-intlayer` がエクスポートするフックを使用して、`.astro` ファイルで辞書を利用します。これらは `react-intlayer` と同じシグネチャを共有しており、`useIntlayer("key")` は辞書の内容を返し、`useLocale()` は現在のロケールを引数なしで返します。
+
+ロケールは `astro-intlayer` ミドルウェアから取得されます。このミドルウェアは独自の `src/middleware.ts` の前に登録され、各リクエストについて URL プレフィックス、クライアントが保持するロケール（Cookie またはヘッダー）、`Accept-Language` の順に解決し、`Astro.locals.intlayer` に保存します。事前レンダリングされたページは訪問者ごとに一度だけレンダリングされるため、URL のみを使用します。
+
+また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにSvelteアイランドを組み込む必要があります。
 
 ```astro fileName="src/pages/[...locale]/index.astro"
 ---
+import { useIntlayer, useLocale } from "astro-intlayer";
 import {
-  getIntlayer,
-  getLocaleFromPath,
   getLocalizedUrl,
-  getHTMLTextDir,
   getPrefix,
   localeMap,
   defaultLocale,
-  type LocalesValues,
+  getHTMLTextDir,
 } from "intlayer";
 import SvelteIsland from "../../components/svelte/SvelteIsland.svelte";
 
@@ -260,8 +289,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// ミドルウェアによって解決されたロケール（例: /ja/about -> 'ja'）
+const { locale } = useLocale();
+
+// そのロケールの 'app' 辞書の内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -317,6 +349,8 @@ const { title } = getIntlayer("app", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` は、独自のミドルウェアやエンドポイントにも `locale`、`defaultLocale`、`availableLocales` を公開します。第2引数としてロケールまたはセレクターを渡すことで（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）、1回の呼び出しに対してリクエストロケールを上書きできます。
+
 > **ルーティング設定に関する注意:**
 > 使用するディレクトリ構造は、`intlayer.config.ts` の `middleware.routing` 設定によります：
 >
@@ -437,10 +471,10 @@ const pathList: SitemapUrlEntry[] = [
   { path: "/about", changefreq: "monthly", priority: 0.7 },
 ];
 
-const SITE_URL = import.meta.env.SITE ?? "http://localhost:4321";
-
 export const GET: APIRoute = async ({ site }) => {
-  const xmlOutput = generateSitemap(pathList, { siteUrl: SITE_URL });
+  const xmlOutput = generateSitemap(pathList, {
+    siteUrl: "https://example.com",
+  });
 
   return new Response(xmlOutput, {
     headers: { "Content-Type": "application/xml" },
@@ -544,21 +578,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel compiler'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-Update your `vite.config.ts` to include the `intlayerCompiler` plugin:
-
-```ts fileName="vite.config.ts"
-import { defineConfig } from "vite";
-import { intlayer, intlayerCompiler } from "vite-intlayer";
-
-export default defineConfig({
-  plugins: [
-    intlayer(),
-    intlayerCompiler(), // Adds the compiler plugin
-  ],
-});
-```
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
 
 ```bash packageManager="npm"
 npm run build # Or npm run dev

package/docs/ja/intlayer_with_astro_vue.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-21
 title: "Astro + Vue i18n - あなたのアプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）Astro + Vueアプリを構築するためのガイド。AIエージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -19,6 +19,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-astro-template
 applicationShowcase: https://intlayer-astro-template.vercel.app
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "Astro ページでの astro-intlayer の useIntlayer / useLocale フックの使用"
   - version: 8.9.0
     date: 2026-05-04
     changes: "Solid の useIntlayer API の使用法を直接プロパティアクセスに更新"
@@ -150,7 +153,7 @@ bun add intlayer astro-intlayer vue vue-intlayer @astrojs/vue
   設定管理、翻訳、[コンテンツ宣言](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/dictionary/content_file.md)、トランスパイル、および[CLIコマンド](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/cli/index.md)のための国際化ツールを提供するコアパッケージ。
 
 - **astro-intlayer**
-  Intlayerを[Viteバンドラー](https://vite.dev/guide/why.html#why-bundle-for-production)と統合するためのAstro統合プラグイン、およびユーザーの優先ロケールの検出、クッキーの管理、URLリダイレクトの処理を行うミドルウェアが含まれています。
+  Intlayer を [Vite バンドラー](https://vite.dev/guide/why.html#why-bundle-for-production) と統合する Astro 統合プラグイン、各リクエストのロケールを `Astro.locals.intlayer` に解決するミドルウェア、および `useIntlayer` / `useDictionary` / `useLocale` フックが含まれています。同じインポートパスが `.astro` フロントマターのサーバー実装と `<script>` ブロック内のクライアント実装（`vanilla-intlayer` ベース）に解決されます。
 
 - **vue**
   コアVueパッケージ。
@@ -164,6 +167,30 @@ bun add intlayer astro-intlayer vue vue-intlayer @astrojs/vue
 </Step>
 <Step number={2} title="プロジェクトの設定">
 
+### アーキテクチャ
+
+このアーキテクチャでは、`astro.config.ts` に登録された `intlayer()` 統合が辞書をビルドし、各リクエストのロケールを解決して `Astro.locals.intlayer` に公開するミドルウェアを追加します。ページは `src/pages/[...locale]/` レストセグメントの下に配置されるため、デフォルトロケールはプレフィックスなしで提供され、他のすべてのロケールには専用の URL が割り当てられます。`.astro` ファイルはサーバーレンダリング用に `astro-intlayer` の `useIntlayer` / `useLocale` フックを使用してコンテンツを読み取り、Vue アイランド (`src/components/vue/VueIsland.vue`) はサーバーで検出されたロケールを prop として受け取り、インタラクティブ部分のために `vue-intlayer` に渡します。コンテンツ宣言は `src/` 内のコンポーネントと一緒に配置されます。
+
+```bash
+.
+├── src
+│   ├── app.content.ts                # App content declaration
+│   ├── components
+│   │   └── vue
+│   │       └── VueIsland.vue         # Vue island (content + locale switcher)
+│   └── pages
+│       ├── [...locale]
+│       │   └── index.astro           # Localized page mounting the island
+│       ├── robots.txt.ts             # robots.txt endpoint
+│       └── sitemap.xml.ts            # Localized sitemap endpoint
+├── astro.config.ts                   # Astro config with the intlayer() and vue() integrations
+├── intlayer.config.ts
+├── package.json
+└── tsconfig.json
+```
+
+### 設定
+
 アプリケーションの言語を設定するための設定ファイルを作成します：
 
 ```typescript fileName="intlayer.config.ts"
@@ -238,19 +265,21 @@ export default appContent;
 </Step>
 <Step number={5} title="Astroでのコンテンツの使用">
 
-`intlayer`からエクスポートされたコアヘルパーを使用して、`.astro`ファイル内で直接辞書を消費できます。また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにVueアイランドを組み込む必要があります。
+`astro-intlayer` がエクスポートするフックを使用して、`.astro` ファイルで辞書を利用します。これらは `react-intlayer` と同じシグネチャを共有しており、`useIntlayer("key")` は辞書の内容を返し、`useLocale()` は現在のロケールを引数なしで返します。
+
+ロケールは `astro-intlayer` ミドルウェアから取得されます。このミドルウェアは独自の `src/middleware.ts` の前に登録され、各リクエストについて URL プレフィックス、クライアントが保持するロケール（Cookie またはヘッダー）、`Accept-Language` の順に解決し、`Astro.locals.intlayer` に保存します。事前レンダリングされたページは訪問者ごとに一度だけレンダリングされるため、URL のみを使用します。
+
+また、各ページにhreflangや正規リンクなどのSEOメタデータを追加し、クライアントサイドのインタラクティブなコンテンツのためにVueアイランドを組み込む必要があります。
 
 ```astro fileName="src/pages/[...locale]/index.astro"
 ---
+import { useIntlayer, useLocale } from "astro-intlayer";
 import {
-  getIntlayer,
-  getLocaleFromPath,
   getLocalizedUrl,
-  getHTMLTextDir,
   getPrefix,
   localeMap,
   defaultLocale,
-  type LocalesValues,
+  getHTMLTextDir,
 } from "intlayer";
 import VueIsland from "../../components/vue/VueIsland.vue";
 
@@ -260,8 +289,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// ミドルウェアによって解決されたロケール（例: /ja/about -> 'ja'）
+const { locale } = useLocale();
+
+// そのロケールの 'app' 辞書の内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -309,6 +341,8 @@ const { title } = getIntlayer("app", locale);
 </html>
 ```
 
+> `Astro.locals.intlayer` は、独自のミドルウェアやエンドポイントにも `locale`、`defaultLocale`、`availableLocales` を公開します。第2引数としてロケールまたはセレクターを渡すことで（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）、1回の呼び出しに対してリクエストロケールを上書きできます。
+
 > **ルーティング設定に関する注意:**
 > 使用するディレクトリ構造は、`intlayer.config.ts` の `middleware.routing` 設定によります：
 >
@@ -447,10 +481,10 @@ const pathList: SitemapUrlEntry[] = [
   { path: "/about", changefreq: "monthly", priority: 0.7 },
 ];
 
-const SITE_URL = import.meta.env.SITE ?? "http://localhost:4321";
-
 export const GET: APIRoute = async ({ site }) => {
-  const xmlOutput = generateSitemap(pathList, { siteUrl: SITE_URL });
+  const xmlOutput = generateSitemap(pathList, {
+    siteUrl: "https://example.com",
+  });
 
   return new Response(xmlOutput, {
     headers: { "Content-Type": "application/xml" },
@@ -554,21 +588,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel compiler'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-Update your `vite.config.ts` to include the `intlayerCompiler` plugin:
-
-```ts fileName="vite.config.ts"
-import { defineConfig } from "vite";
-import { intlayer, intlayerCompiler } from "vite-intlayer";
-
-export default defineConfig({
-  plugins: [
-    intlayer(),
-    intlayerCompiler(), // Adds the compiler plugin
-  ],
-});
-```
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
 
 ```bash packageManager="npm"
 npm run build # Or npm run dev

package/docs/ja/intlayer_with_react_router_v7.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-04
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "React Router v7 i18n - あなたのアプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）React Router v7アプリを構築するためのガイド。AIエージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -894,8 +894,14 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel コンパイラ'>
 
+ <Tabs>
+ <Tab value='intlayer >= 9'>
+
 > v9 以降、`intlayerCompiler` は `intlayer` プラグインに含まれています。したがって、手動で追加する必要はありません。
 
+ </Tab>
+ <Tab value='intlayer < 9'>
+
 `vite.config.ts` を更新して `intlayerCompiler` プラグインを含めます:
 
 ```ts fileName="vite.config.ts"
@@ -910,6 +916,11 @@ export default defineConfig({
 });
 ```
 
+ </Tab>
+ </Tabs>
+
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
+
 ```bash packageManager="npm"
 npm run build # または npm run dev
 ```

package/docs/ja/intlayer_with_remix_3.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-09-09
-updatedAt: 2026-09-19
+updatedAt: 2026-09-21
 title: "Remix 3 i18n - アプリを多言語化するための完全ガイド"
 description: "もう i18next は不要です。2026 年版、多言語 (i18n) Remix 3 アプリ構築ガイド。AI エージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -137,6 +137,27 @@ bun add intlayer remix-intlayer remix@next
 </Step>
 <Step number={2} title="Intlayer の設定">
 
+### アーキテクチャ
+
+このアーキテクチャでは、`remix-intlayer` の `intlayer()` ミドルウェアが `render()` ミドルウェアの前に `createRouter()` に登録されます。ルーターがマッチングする前にロケールプレフィックスを削除するため、ルートは `:locale` セグメントなしで `src/routes.ts` に一度だけ宣言され、リクエストの残りの部分を `AsyncLocalStorage` スコープ内で実行します。これにより、ルートハンドラーや `remix/ui` ビューで引数なしで `useIntlayer` / `useLocale` がロケールを読み取れるようになります。コンテンツ宣言は `src/` 内のビューと一緒に配置されます：
+
+```bash
+.
+├── src
+│   ├── home.content.ts               # Home page content declaration
+│   ├── router.tsx                    # createRouter() with the intlayer() and render() middleware
+│   ├── routes.ts                     # Type-safe routes, declared once without locale segment
+│   ├── server.ts                     # fetch handler (Node.js, Bun, Deno, Cloudflare Workers)
+│   └── views
+│       ├── document.tsx              # HTML shell setting <html lang dir> from the locale
+│       └── home.tsx                  # Localized page using useIntlayer / useLocale
+├── intlayer.config.ts
+├── package.json
+└── tsconfig.json
+```
+
+### 設定
+
 プロジェクトのルートに `intlayer.config.ts` を作成し、サポートする言語と国際化設定を宣言します。
 
 ```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}

package/docs/ja/intlayer_with_solid_start.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-08-06
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "Solid Start i18n - アプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）SolidStartアプリを構築するためのガイド。サーバーレンダリングされたロケールルーティング、hreflang、サイトマップ、AI支援翻訳。"
 keywords:
@@ -748,15 +748,13 @@ SolidStart は、HTTP メソッドをエクスポートするファイルを API
 import type { APIEvent } from "@solidjs/start/server";
 import { generateSitemap } from "intlayer";
 
-const SITE_URL = process.env.SITE_URL ?? "http://localhost:3000";
-
 export const GET = (_event: APIEvent) => {
   const sitemap = generateSitemap(
     [
       { path: "/", changefreq: "daily", priority: 1.0 },
       { path: "/about", changefreq: "monthly", priority: 0.8 },
     ],
-    { siteUrl: SITE_URL }
+    { siteUrl: "https://example.com" }
   );
 
   return new Response(sitemap, {
@@ -790,8 +788,6 @@ export const GET = (_event: APIEvent) => {
 ```typescript fileName="src/routes/robots.txt.ts" codeFormat={["typescript", "esm", "commonjs"]}
 import { getMultilingualUrls } from "intlayer";
 
-const SITE_URL = process.env.SITE_URL ?? "http://localhost:3000";
-
 const disallowedPaths = ["/admin", "/private"].flatMap((path) =>
   Object.values(getMultilingualUrls(path))
 );
@@ -803,7 +799,7 @@ export const GET = () =>
       "Allow: /",
       ...disallowedPaths.map((path) => `Disallow: ${path}`),
       "",
-      `Sitemap: ${SITE_URL}/sitemap.xml`,
+      `Sitemap: https://example.com/sitemap.xml`,
     ].join("\n"),
     { headers: { "Content-Type": "text/plain" } }
   );
@@ -922,8 +918,14 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel コンパイラ'>
 
+ <Tabs>
+ <Tab value='intlayer >= 9'>
+
 > v9 以降、`intlayerCompiler` は `intlayer` プラグインに含まれています。そのため、手動で追加する必要はありません。
 
+ </Tab>
+ <Tab value='intlayer < 9'>
+
 `vite.config.ts` を更新して `intlayerCompiler` プラグインを含めます:
 
 ```ts fileName="vite.config.ts"
@@ -942,6 +944,11 @@ export default defineConfig({
 });
 ```
 
+ </Tab>
+ </Tabs>
+
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
+
 ```bash packageManager="npm"
 npm run build # または npm run dev
 ```

package/docs/ja/intlayer_with_svelte_kit.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-11-20
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "SvelteKit i18n - あなたのアプリを翻訳する完全ガイド"
 description: "i18nextはもう不要。2026年に多言語（i18n）SvelteKitアプリを構築するためのガイド。AIエージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -709,27 +709,33 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babelコンパイラ'>
 
+ <Tabs>
+ <Tab value='intlayer >= 9'>
+
 > Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
 
-```bash packageManager="bun"
-bun add @intlayer/babel --dev
-```
+ </Tab>
+ <Tab value='intlayer < 9'>
 
-```js fileName="babel.config.js"
-const {
-  intlayerExtractBabelPlugin,
-  getExtractPluginOptions,
-} = require("@intlayer/babel");
+`intlayerCompiler` プラグインを含めるように `vite.config.ts` を更新します：
+
+```ts fileName="vite.config.ts"
+import { defineConfig } from "vite";
+import { intlayer, intlayerCompiler } from "vite-intlayer";
 
-module.exports = {
-  presets: ["next/babel"],
+export default defineConfig({
   plugins: [
-    // コンポーネントから辞書へコンテンツを抽出する
-    [intlayerExtractBabelPlugin, getExtractPluginOptions()],
+    intlayer(),
+    intlayerCompiler(), // Adds the compiler plugin
   ],
-};
+});
 ```
 
+ </Tab>
+ </Tabs>
+
+アプリケーションをビルドしてコンポーネントを変換し、コンテンツを抽出します。
+
 ```bash packageManager="npm"
 npm run build # または npm run dev
 ```
@@ -743,7 +749,7 @@ yarn build # または yarn dev
 ```
 
 ```bash packageManager="bun"
-bun run build # Or bun run dev
+bun run build # または bun run dev
 ```
 
  </Tab>