@intlayer/docs 5.7.4 → 5.7.6-canary.0

package/docs/it/packages/react-intlayer/useI18n.md

@@ -0,0 +1,250 @@
+---
+createdAt: 2024-08-11
+updatedAt: 2025-06-29
+title: Documentazione Hook useI18n | react-intlayer
+description: Scopri come utilizzare l'hook useI18n nel pacchetto react-intlayer
+keywords:
+  - useI18n
+  - i18n
+  - traduzione
+  - dizionario
+  - Intlayer
+  - internazionalizzazione
+  - documentazione
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - doc
+  - packages
+  - react-intlayer
+  - useI18n
+---
+
+# Integrazione React: Documentazione Hook `useI18n`
+
+Questa sezione fornisce una guida dettagliata su come utilizzare l'hook `useI18n` all'interno delle applicazioni React, permettendo una localizzazione efficiente dei contenuti.
+
+## Importare `useI18n` in React
+
+L'hook `useI18n` può essere importato e integrato nelle applicazioni React a seconda del contesto come segue:
+
+- **Componenti Client:**
+
+  ```typescript codeFormat="typescript"
+  import { useI18n } from "react-intlayer"; // Usare nei componenti React lato client
+  ```
+
+  ```javascript codeFormat="esm"
+  import { useI18n } from "react-intlayer"; // Usare nei componenti React lato client
+  ```
+
+  ```javascript codeFormat="commonjs"
+  const { useI18n } = require("react-intlayer"); // Usare nei componenti React lato client
+  ```
+
+- **Componenti Server:**
+
+  ```typescript codeFormat="commonjs"
+  import { useI18n } from "react-intlayer/server"; // Usare nei componenti React lato server
+  ```
+
+  ```javascript codeFormat="esm"
+  import { useI18n } from "react-intlayer/server"; // Usare nei componenti React lato server
+  ```
+
+  ```javascript codeFormat="commonjs"
+  const { useI18n } = require("react-intlayer/server"); // Usare nei componenti React lato server
+  ```
+
+## Parametri
+
+Questo hook accetta due parametri:
+
+1. **`namespace`**: Un namespace del dizionario per delimitare le chiavi di traduzione.
+2. **`locale`** (opzionale): La locale desiderata. Se non specificata, verrà usata come default la locale del contesto.
+
+## Dizionario
+
+Tutte le chiavi del dizionario devono essere dichiarate all'interno dei file di dichiarazione del contenuto per migliorare la sicurezza dei tipi e prevenire errori. [Le istruzioni di configurazione si trovano qui](https://github.com/aymericzip/intlayer/blob/main/docs/docs/it/dictionary/get_started.md).
+
+## Esempi di utilizzo in React
+
+Esempi di utilizzo dell'hook `useI18n` all'interno di componenti React:
+
+```tsx fileName="src/App.tsx" codeFormat="typescript"
+import type { FC } from "react";
+import { ClientComponentExample, ServerComponentExample } from "@components";
+import { IntlayerProvider } from "react-intlayer";
+import { useI18n, IntlayerServerProvider } from "react-intlayer/server";
+import { Locales } from "intlayer";
+
+const App: FC<{ locale: Locales }> = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduction")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```jsx fileName="src/app.jsx" codeFormat="esm"
+import { ClientComponentExample, ServerComponentExample } from "@components";
+import { IntlayerProvider } from "react-intlayer";
+import { IntlayerServerProvider, useI18n } from "react-intlayer/server";
+
+const App = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduzione")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```jsx fileName="src/app.cjs" codeFormat="commonjs"
+const { IntlayerProvider } = require("react-intlayer");
+const { IntlayerServerProvider, useI18n } = require("react-intlayer/server");
+
+const App = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduzione")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```tsx fileName="src/components/ComponentExample.tsx" codeFormat="typescript"
+import type { FC } from "react";
+import { useI18n } from "react-intlayer";
+
+const ComponentExample: FC = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* Mostra il titolo */}
+      <p>{t("description")}</p> {/* Mostra la descrizione */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ComponentExample.jsx" codeFormat="esm"
+import { useI18n } from "react-intlayer";
+
+const ComponentExample = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* Mostra il titolo */}
+      <p>{t("description")}</p> {/* Mostra la descrizione */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ComponentExample.cjs" codeFormat="commonjs"
+const { useI18n } = require("react-intlayer");
+
+const ComponentExample = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* Mostra il titolo */}
+      <p>{t("description")}</p> {/* Mostra la descrizione */}
+    </div>
+  );
+};
+```
+
+```tsx fileName="src/components/ServerComponentExample.tsx" codeFormat="typescript"
+import { useI18n } from "react-intlayer/server";
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* Mostra il titolo */}
+      <p>{t("description")}</p> {/* Mostra la descrizione */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ServerComponentExample.jsx" codeFormat="esm"
+import { useI18n } from "react.intlayer/server";
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* Mostra il titolo */}
+      <p>{t("description")}</p> {/* Mostra la descrizione */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ServerComponentExample.cjs" codeFormat="commonjs"
+const { useI18n } = require("react.intlayer/server");
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1>
+      <p>{t("description")}</p>
+    </div>
+  );
+};
+```
+
+## Gestione degli Attributi
+
+Quando si localizzano gli attributi, accedere correttamente ai valori di traduzione:
+
+```jsx
+<!-- Per gli attributi di accessibilità (es. aria-label), usare .value poiché sono richieste stringhe pure -->
+<button aria-label={t("button.ariaLabel").value}>{t("button.text")}</button>
+```
+
+## Risorse Aggiuntive
+
+- **Intlayer Visual Editor**: Per un'esperienza di gestione dei contenuti più intuitiva, fare riferimento alla documentazione dell'editor visuale [qui](https://github.com/aymericzip/intlayer/blob/main/docs/docs/it/intlayer_visual_editor.md).
+
+Questa sezione copre specificamente l'integrazione del hook `useI18n` nelle applicazioni React, semplificando il processo di localizzazione e garantendo la coerenza dei contenuti tra le diverse localizzazioni.
+
+## Cronologia della Documentazione
+
+- 6.0.0 - 2025-06-29: Scrittura iniziale della documentazione dell'hook `useI18n`

package/docs/it/vs_code_extension.md

@@ -14,7 +14,6 @@ keywords:
   - TypeScript
 slugs:
   - doc
-  - it
   - vs-code-extension
 ---
 

package/docs/ja/configuration.md

@@ -268,10 +268,12 @@ module.exports = config;
 - **prefixDefault**:
 
   - _型_: `boolean`
-  - _デフォルト_: `true`
+  - _デフォルト_: `false`
   - _説明_: デフォルトのロケールをURLに含めるかどうか。
-  - _例_: `false`
-  - _注意_: `false`の場合、デフォルトロケールのURLにはロケールプレフィックスが付きません。
+  - _例_: `true`
+  - _注意_:
+    - `true`で`defaultLocale = 'en'`の場合: path = `/en/dashboard`または`/fr/dashboard`
+    - `false`で`defaultLocale = 'en'`の場合: path = `/dashboard`または`/fr/dashboard`
 
 - **basePath**:
 
@@ -279,7 +281,11 @@ module.exports = config;
   - _デフォルト_: `''`
   - _説明_: アプリケーションURLのベースパス。
   - _例_: `'/my-app'`
-  - _注意_: これはアプリケーションのURL構築に影響します。
+  - _注意_:
+    - アプリケーションが`https://example.com/my-app`でホストされている場合
+    - ベースパスは`'/my-app'`
+    - URLは`https://example.com/my-app/en`になります
+    - ベースパスが設定されていない場合、URLは`https://example.com/en`になります
 
 - **serverSetCookie**:
 
@@ -291,11 +297,42 @@ module.exports = config;
   - _注意_: ロケールクッキーをすべてのリクエストで設定するか、まったく設定しないかを制御します。
 
 - **noPrefix**:
+
   - _型_: `boolean`
   - _デフォルト_: `false`
   - _説明_: URLからロケールプレフィックスを省略するかどうか。
   - _例_: `true`
-  - _注意_: `true`の場合、URLにはロケール情報が含まれません。
+  - _注意_:
+    - `true`の場合: URLにプレフィックスなし
+    - `false`の場合: URLにプレフィックスあり
+    - `basePath = '/my-app'`の例:
+      - `noPrefix = false`の場合: URLは`https://example.com/my-app/en`になります
+      - `noPrefix = true`の場合: URLは`https://example.com`になります
+
+- **detectLocaleOnPrefetchNoPrefix**:
+
+  - _型_: `boolean`
+  - _デフォルト_: `false`
+  - _説明_: Next.jsのプリフェッチリクエスト中にロケール検出が行われるかどうかを制御します。
+  - _例_: `true`
+  - _注意_: この設定はNext.jsがロケールプリフェッチを処理する方法に影響します:
+    - **例のシナリオ:**
+      - ユーザーのブラウザ言語は`'fr'`
+      - 現在のページは`/fr/about`
+      - リンクが`/about`をプリフェッチ
+    - **`detectLocaleOnPrefetchNoPrefix: true`の場合:**
+      - プリフェッチがブラウザから`'fr'`ロケールを検出
+      - プリフェッチを`/fr/about`にリダイレクト
+    - **`detectLocaleOnPrefetchNoPrefix: false`（デフォルト）の場合:**
+      - プリフェッチがデフォルトロケールを使用
+      - プリフェッチを`/en/about`にリダイレクト（`'en'`がデフォルトと仮定）
+    - **`true`を使用する場合:**
+      - アプリが非ローカライズされた内部リンクを使用する場合（例: `<a href="/about">`）
+      - 通常のリクエストとプリフェッチリクエスト間で一貫したロケール検出動作を望む場合
+    - **`false`（デフォルト）を使用する場合:**
+      - アプリがロケールプレフィックス付きリンクを使用する場合（例: `<a href="/fr/about">`）
+      - プリフェッチパフォーマンスを最適化したい場合
+      - 潜在的なリダイレクトループを避けたい場合
 
 ---
 
@@ -505,26 +542,4 @@ Intlayerがアプリケーションの国際化をどのように最適化しビ
   - _説明_: 辞書がどのようにインポートされるかを制御します。
   - _例_: `'dynamic'`
   - _注意_: 利用可能なモード：
-    - "static": 辞書が静的にインポートされます。`useIntlayer`を`useDictionary`に置き換えます。
-    - "dynamic": 辞書がSuspenseを使用して動的にインポートされます。`useIntlayer`を`useDictionaryDynamic`に置き換えます。
-    - "async": 辞書が非同期で動的にインポートされます。`useIntlayer`を`await useDictionaryAsync`に置き換えます。
-  - _注意_: 動的インポートはSuspenseに依存し、レンダリングパフォーマンスに若干の影響を与える可能性があります。
-  - _注意_: 無効にすると、使用されていない場合でもすべてのロケールが一度に読み込まれます。
-  - _注意_: このオプションは`@intlayer/babel`および`@intlayer/swc`プラグインに依存します。
-  - _注意_: すべてのキーが`useIntlayer`呼び出しで静的に宣言されていることを確認してください。例：`useIntlayer('navbar')`。
-  - _注意_: このオプションは`optimize`が無効の場合は無視されます。
-  - _注意_: ほとんどの場合、Reactアプリケーションには`"dynamic"`が、Vue.jsアプリケーションには`"async"`が使用されます。
-  - _注意_: このオプションは`getIntlayer`、`getDictionary`、`useDictionary`、`useDictionaryAsync`、`useDictionaryDynamic`関数に影響しません。
-
-- **traversePattern**:
-  - _型_: `string[]`
-  - _デフォルト_: `['**/*.{js,ts,mjs,cjs,jsx,tsx,mjx,cjx}', '!**/node_modules/**']`
-  - _説明_: 最適化中にトラバースするファイルを定義するパターン。
-    - _例_: `['src/**/*.{ts,tsx}', '../ui-library/**/*.{ts,tsx}', '!**/node_modules/**']`
-  - _注意_: 関連するコードファイルに最適化を制限し、ビルドパフォーマンスを向上させるために使用します。
-  - _注意_: このオプションは`optimize`が無効の場合は無視されます。
-  - _注意_: globパターンを使用します。
-
-## ドキュメント履歴
-
-- 5.5.11 - 2025-06-29: `docs`コマンドを追加
+    - "static": 辞書が静的にインポートされます。`useIntlayer`を`useDictionary`

package/docs/ja/dictionary/enumeration.md

@@ -15,8 +15,6 @@ slugs:
   - doc
   - concept
   - content
-  - ja
-  - dictionary
   - enumeration
 ---
 

package/docs/ja/packages/react-intlayer/useI18n.md

@@ -0,0 +1,250 @@
+---
+createdAt: 2024-08-11
+updatedAt: 2025-06-29
+title: useI18n フック ドキュメント | react-intlayer
+description: react-intlayer パッケージで useI18n フックを使用する方法を学ぶ
+keywords:
+  - useI18n
+  - i18n
+  - 翻訳
+  - 辞書
+  - Intlayer
+  - 国際化
+  - ドキュメント
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - doc
+  - packages
+  - react-intlayer
+  - useI18n
+---
+
+# React 統合: `useI18n` フック ドキュメント
+
+このセクションでは、React アプリケーション内で `useI18n` フックを使用して効率的なコンテンツのローカライズを実現する方法について詳細に説明します。
+
+## React での `useI18n` のインポート
+
+`useI18n` フックは、以下のようにコンテキストに応じて React アプリケーションにインポートおよび統合できます。
+
+- **クライアントコンポーネント:**
+
+  ```typescript codeFormat="typescript"
+  import { useI18n } from "react-intlayer"; // クライアントサイドの React コンポーネントで使用
+  ```
+
+  ```javascript codeFormat="esm"
+  import { useI18n } from "react-intlayer"; // クライアントサイドの React コンポーネントで使用
+  ```
+
+  ```javascript codeFormat="commonjs"
+  const { useI18n } = require("react-intlayer"); // クライアントサイドの React コンポーネントで使用
+  ```
+
+- **サーバーコンポーネント:**
+
+  ```typescript codeFormat="commonjs"
+  import { useI18n } from "react-intlayer/server"; // サーバーサイドの React コンポーネントで使用
+  ```
+
+  ```javascript codeFormat="esm"
+  import { useI18n } from "react-intlayer/server"; // サーバーサイドの React コンポーネントで使用
+  ```
+
+  ```javascript codeFormat="commonjs"
+  const { useI18n } = require("react-intlayer/server"); // サーバーサイドの React コンポーネントで使用
+  ```
+
+## パラメータ
+
+このフックは2つのパラメータを受け取ります：
+
+1. **`namespace`**：翻訳キーのスコープを指定する辞書の名前空間。
+2. **`locale`**（オプション）：希望するロケール。指定しない場合は、コンテキストのロケールがデフォルトで使用されます。
+
+## 辞書
+
+すべての辞書キーは、型安全性を高めエラーを防ぐためにコンテンツ宣言ファイル内で宣言する必要があります。[設定手順はこちら](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/dictionary/get_started.md)で確認できます。
+
+## Reactでの使用例
+
+Reactコンポーネント内で`useI18n`フックを使用する例：
+
+```tsx fileName="src/App.tsx" codeFormat="typescript"
+import type { FC } from "react";
+import { ClientComponentExample, ServerComponentExample } from "@components";
+import { IntlayerProvider } from "react-intlayer";
+import { useI18n, IntlayerServerProvider } from "react-intlayer/server";
+import { Locales } from "intlayer";
+
+const App: FC<{ locale: Locales }> = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduction")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```jsx fileName="src/app.jsx" codeFormat="esm"
+import { ClientComponentExample, ServerComponentExample } from "@components";
+import { IntlayerProvider } from "react-intlayer";
+import { IntlayerServerProvider, useI18n } from "react-intlayer/server";
+
+const App = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduction")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```jsx fileName="src/app.cjs" codeFormat="commonjs"
+const { IntlayerProvider } = require("react-intlayer");
+const { IntlayerServerProvider, useI18n } = require("react-intlayer/server");
+
+const App = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduction")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <IntlayerServerProvider locale={locale}>
+        <ServerComponentExample />
+      </IntlayerServerProvider>
+    </>
+  );
+};
+```
+
+```tsx fileName="src/components/ComponentExample.tsx" codeFormat="typescript"
+import type { FC } from "react";
+import { useI18n } from "react-intlayer";
+
+const ComponentExample: FC = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* タイトルを表示 */}
+      <p>{t("description")}</p> {/* 説明を表示 */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ComponentExample.jsx" codeFormat="esm"
+import { useI18n } from "react-intlayer";
+
+const ComponentExample = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* タイトルを表示 */}
+      <p>{t("description")}</p> {/* 説明を表示 */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ComponentExample.cjs" codeFormat="commonjs"
+const { useI18n } = require("react-intlayer");
+
+const ComponentExample = () => {
+  const t = useI18n("component-example");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* タイトルを表示 */}
+      <p>{t("description")}</p> {/* 説明を表示 */}
+    </div>
+  );
+};
+```
+
+```tsx fileName="src/components/ServerComponentExample.tsx" codeFormat="typescript"
+import { useI18n } from "react-intlayer/server";
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* タイトルを表示 */}
+      <p>{t("description")}</p> {/* 説明を表示 */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ServerComponentExample.jsx" codeFormat="esm"
+import { useI18n } from "react-intlayer/server";
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1> {/* タイトルを表示 */}
+      <p>{t("description")}</p> {/* 説明を表示 */}
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/ServerComponentExample.cjs" codeFormat="commonjs"
+const { useI18n } = require("react-intlayer/server");
+
+const ServerComponentExample = () => {
+  const t = useI18n("server-component");
+
+  return (
+    <div>
+      <h1>{t("title")}</h1>
+      <p>{t("description")}</p>
+    </div>
+  );
+};
+```
+
+## 属性の取り扱い
+
+属性をローカライズする際は、翻訳値に適切にアクセスしてください：
+
+```jsx
+<!-- アクセシビリティ属性（例：aria-label）には、純粋な文字列が必要なため .value を使用します -->
+<button aria-label={t("button.ariaLabel").value}>{t("button.text")}</button>
+```
+
+## 追加リソース
+
+- **Intlayer ビジュアルエディター**: より直感的なコンテンツ管理体験のために、ビジュアルエディターのドキュメントは[こちら](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)をご参照ください。
+
+このセクションでは、Reactアプリケーションにおける `useI18n` フックの統合について具体的に説明しており、ローカライズプロセスを簡素化し、異なるロケール間でのコンテンツの一貫性を確保します。
+
+## ドキュメント履歴
+
+- 6.0.0 - 2025-06-29: `useI18n` フックのドキュメント初版作成

package/docs/ko/configuration.md

@@ -268,10 +268,12 @@ module.exports = config;
 - **prefixDefault**:
 
   - _유형_: `boolean`
-  - _기본값_: `true`
+  - _기본값_: `false`
   - _설명_: 기본 로케일을 URL에 포함할지 여부입니다.
-  - _예시_: `false`
-  - _참고_: `false`로 설정하면 기본 로케일의 URL에는 로케일 접두사가 포함되지 않습니다.
+  - _예시_: `true`
+  - _참고_:
+    - `true`이고 `defaultLocale = 'en'`인 경우: path = `/en/dashboard` 또는 `/fr/dashboard`
+    - `false`이고 `defaultLocale = 'en'`인 경우: path = `/dashboard` 또는 `/fr/dashboard`
 
 - **basePath**:
 
@@ -279,7 +281,11 @@ module.exports = config;
   - _기본값_: `''`
   - _설명_: 애플리케이션 URL의 기본 경로입니다.
   - _예시_: `'/my-app'`
-  - _참고_: 이 설정은 애플리케이션의 URL 구성 방식에 영향을 미칩니다.
+  - _참고_:
+    - 애플리케이션이 `https://example.com/my-app`에서 호스팅되는 경우
+    - 기본 경로는 `'/my-app'`
+    - URL은 `https://example.com/my-app/en`이 됩니다
+    - 기본 경로가 설정되지 않은 경우 URL은 `https://example.com/en`이 됩니다
 
 - **serverSetCookie**:
 
@@ -291,11 +297,42 @@ module.exports = config;
   - _참고_: 로케일 쿠키를 모든 요청에서 설정할지 또는 설정하지 않을지를 제어합니다.
 
 - **noPrefix**:
+
   - _유형_: `boolean`
   - _기본값_: `false`
   - _설명_: URL에서 로케일 접두사를 생략할지 여부를 나타냅니다.
   - _예시_: `true`
-  - _참고_: `true`로 설정하면 URL에 로케일 정보가 포함되지 않습니다.
+  - _참고_:
+    - `true`인 경우: URL에 접두사 없음
+    - `false`인 경우: URL에 접두사 있음
+    - `basePath = '/my-app'` 예시:
+      - `noPrefix = false`인 경우: URL은 `https://example.com/my-app/en`이 됩니다
+      - `noPrefix = true`인 경우: URL은 `https://example.com`이 됩니다
+
+- **detectLocaleOnPrefetchNoPrefix**:
+
+  - _유형_: `boolean`
+  - _기본값_: `false`
+  - _설명_: Next.js 프리페치 요청 중 로케일 감지가 발생하는지 제어합니다.
+  - _예시_: `true`
+  - _참고_: 이 설정은 Next.js가 로케일 프리페치를 처리하는 방식에 영향을 미칩니다:
+    - **예시 시나리오:**
+      - 사용자의 브라우저 언어는 `'fr'`
+      - 현재 페이지는 `/fr/about`
+      - 링크가 `/about`을 프리페치
+    - **`detectLocaleOnPrefetchNoPrefix: true`인 경우:**
+      - 프리페치가 브라우저에서 `'fr'` 로케일을 감지
+      - 프리페치를 `/fr/about`으로 리다이렉트
+    - **`detectLocaleOnPrefetchNoPrefix: false`(기본값)인 경우:**
+      - 프리페치가 기본 로케일을 사용
+      - 프리페치를 `/en/about`으로 리다이렉트(`'en'`이 기본값이라고 가정)
+    - **`true`를 사용하는 경우:**
+      - 앱이 비로컬라이즈된 내부 링크를 사용하는 경우(예: `<a href="/about">`)
+      - 일반 요청과 프리페치 요청 간에 일관된 로케일 감지 동작을 원하는 경우
+    - **`false`(기본값)를 사용하는 경우:**
+      - 앱이 로케일 접두사가 있는 링크를 사용하는 경우(예: `<a href="/fr/about">`)
+      - 프리페치 성능을 최적화하고 싶은 경우
+      - 잠재적인 리다이렉트 루프를 피하고 싶은 경우
 
 ---