@intlayer/docs 9.5.5 → 9.5.6

package/docs/vi/intlayer_with_vite+vanilla.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-03-23
-updatedAt: 2026-06-23
+updatedAt: 2026-09-20
 title: "Vite + Vanilla JS i18n - Hướng dẫn đầy đủ để dịch ứng dụng của bạn"
 description: "Không còn i18next nữa. Hướng dẫn 2026 để xây dựng ứng dụng Vite + Vanilla JS đa ngôn ngữ (i18n). Dịch với các AI agent và tối ưu hóa kích thước bundle, SEO và hiệu suất."
 keywords:
@@ -613,8 +613,14 @@ bun x intlayer extract
  </Tab>
  <Tab value='Trình biên dịch 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.
 
+ </Tab>
+ <Tab value='intlayer < 9'>
+
 Cập nhật `vite.config.ts` của bạn để bao gồm plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -629,6 +635,11 @@ export default defineConfig({
 });
 ```
 
+ </Tab>
+ </Tabs>
+
+Build ứng dụng của bạn để chuyển đổi các thành phần và trích xuất nội dung
+
 ```bash packageManager="npm"
 npm run build # Hoặc npm run dev
 ```
@@ -685,7 +696,9 @@ const pathList = [
   { path: "/about", changefreq: "monthly", priority: 0.7 },
 ];
 
-const sitemapXml = generateSitemap(pathList, { siteUrl: SITE_URL });
+const sitemapXml = generateSitemap(pathList, {
+  siteUrl: "https://example.com",
+});
 fs.writeFileSync(path.join(__dirname, "public", "sitemap.xml"), sitemapXml);
 
 const getAllMultilingualUrls = (urls) =>
@@ -698,7 +711,7 @@ const robotsTxt = [
   "Allow: /",
   ...disallowedPaths.map((path) => `Disallow: ${path}`),
   "",
-  `Sitemap: ${SITE_URL}/sitemap.xml`,
+  `Sitemap: https://example.com/sitemap.xml`,
 ].join("\n");
 
 fs.writeFileSync(path.join(__dirname, "public", "robots.txt"), robotsTxt);

package/docs/vi/intlayer_with_vite+vue.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2026-06-23
+updatedAt: 2026-09-20
 title: "Vite + Vue i18n - Hướng dẫn đầy đủ để dịch ứng dụng của bạn"
 description: "Không còn i18next nữa. Hướng dẫn 2026 để xây dựng ứng dụng Vite + Vue đa ngôn ngữ (i18n). Dịch với các AI agent và tối ưu hóa kích thước bundle, SEO và hiệu suất."
 keywords:
@@ -982,8 +982,14 @@ bun x intlayer extract
  </Tab>
  <Tab value='Trình biên dịch 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.
 
+ </Tab>
+ <Tab value='intlayer < 9'>
+
 Cập nhật `vite.config.ts` của bạn để bao gồm plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -998,6 +1004,11 @@ export default defineConfig({
 });
 ```
 
+ </Tab>
+ </Tabs>
+
+Build ứng dụng của bạn để chuyển đổi các thành phần và trích xuất nội dung
+
 ```bash packageManager="npm"
 npm run build # Hoặc npm run dev
 ```
@@ -1054,7 +1065,9 @@ const pathList = [
   { path: "/about", changefreq: "monthly", priority: 0.7 },
 ];
 
-const sitemapXml = generateSitemap(pathList, { siteUrl: SITE_URL });
+const sitemapXml = generateSitemap(pathList, {
+  siteUrl: "https://example.com",
+});
 fs.writeFileSync(path.join(__dirname, "public", "sitemap.xml"), sitemapXml);
 
 const getAllMultilingualUrls = (urls) =>
@@ -1067,7 +1080,7 @@ const robotsTxt = [
   "Allow: /",
   ...disallowedPaths.map((path) => `Disallow: ${path}`),
   "",
-  `Sitemap: ${SITE_URL}/sitemap.xml`,
+  `Sitemap: https://example.com/sitemap.xml`,
 ].join("\n");
 
 fs.writeFileSync(path.join(__dirname, "public", "robots.txt"), robotsTxt);

package/docs/vi/introduction.md

@@ -189,7 +189,6 @@ Chúng tôi đã xây dựng Intlayer với tính linh hoạt cao, cung cấp kh
 - **[Intlayer với Astro + Solid](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_astro_solid.md)**
 - **[Intlayer với Astro + Preact](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_astro_preact.md)**
 - **[Intlayer với Astro + Lit](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_astro_lit.md)**
-- **[Intlayer với Astro + Vanilla JS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_astro_vanilla.md)**
 - **[Intlayer với Vite + Vue](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_vite+vue.md)**
 - **[Intlayer với Nuxt](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_nuxt.md)**
 - **[Intlayer với Vite + Svelte](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_with_vite+svelte.md)**

package/docs/vi/readme.md

@@ -212,7 +212,6 @@ Khám phá tài liệu toàn diện của chúng tôi để bắt đầu với I
       <li><a href="https://intlayer.org/doc/environment/astro/vue" rel=''>Vue</a></li>
       <li><a href="https://intlayer.org/doc/environment/astro/svelte" rel=''>Svelte</a></li>
       <li><a href="https://intlayer.org/doc/environment/astro/solid" rel=''>Solid</a></li>
-      <li><a href="https://intlayer.org/doc/environment/astro/vanilla" rel=''>Vanilla JS</a></li>
       <li><a href="https://intlayer.org/doc/environment/astro/lit" rel=''>Lit</a></li>
     </ul>
   </li>

package/docs/vi/releases/v8.md

@@ -1328,10 +1328,6 @@ Intlayer hiện tự động tạo sitemap dựa trên các locale và chế đ
 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: {
@@ -1341,7 +1337,7 @@ export const Route = createFileRoute("/sitemap.xml")({
             { path: "/", changefreq: "daily", priority: 1.0 },
             { path: "/about", changefreq: "monthly", priority: 0.8 },
           ],
-          { siteUrl: SITE_URL }
+          { siteUrl: "https://example.com" }
         );
 
         return new Response(sitemap, {

package/docs/zh/intlayer_with_astro.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-03-07
-updatedAt: 2026-09-19
+updatedAt: 2026-09-20
 title: "Astro i18n - 翻译你的应用的完整指南"
 description: "告别 i18next。2026 年构建多语言 (i18n) Astro 应用的完整指南。使用 AI 代理翻译并优化包体积、SEO 和性能。"
 keywords:
@@ -401,7 +401,7 @@ const pathWithoutLocale = getPathWithoutLocale(Astro.url.pathname);
 ```
 
 > **持久化注意事项：**
-> 客户端 `useLocale` 中的 `setLocale` 将用户的语言偏好保存在 Cookie 中。这允许 Intlayer 中间件记住该选择，并在将来的访问中自动将用户重定向到其首选语言。
+> 客户端 `useLocale` 中的 `setLocale` 将用户的语言偏好保存在 cookie 中。这使 Intlayer 能够记住该选择，并在将来的访问中自动将用户重定向到其首选语言：按需渲染的页面（带有 `output: 'server'` 或 `prerender = false` 的适配器）在发送任何 HTML 之前由 Intlayer 中间件重定向，而作为静态文件提供的预渲染页面则由集成注入每个页面的小脚本重定向。将 `routing.enableProxy` 设置为 `false` 可同时关闭两者。在 `astro dev` 中，除非将 `routing.enableProxy` 设置为 `true`，否则 cookie 将被忽略作为重定向来源，因此过期的 cookie 不会劫持你正在处理的页面。
 >
 > **服务端 / 客户端互兼容性：**
 > `astro-intlayer` 在 frontmatter 中解析为服务端钩子（读取 `Astro.locals`），在 `<script>` 块和孤岛（islands）中解析为 `vanilla-intlayer` 的客户端钩子，具有相同的名称和内容结构。`setLocale` 和 `onChange` 仅在客户端起作用，在客户端调用一次 `installIntlayer()` 以初始化客户端存储。`astro-intlayer/client` 显式公开客户端入口。
@@ -428,10 +428,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" },
@@ -478,7 +478,6 @@ export const GET: APIRoute = ({ site }) => {
 - Intlayer + Solid: [Intlayer with Solid](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/intlayer_with_astro_solid.md)
 - Intlayer + Preact: [Intlayer with Preact](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/intlayer_with_astro_preact.md)
 - Intlayer + Lit: [Intlayer with Lit](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/intlayer_with_astro_lit.md)
-- Intlayer + Vanilla JS: [Intlayer with Vanilla JS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/intlayer_with_astro_vanilla.md)
 </Step>
 
 <Step number={15} title="提取组件中的内容" isOptional={true}>
@@ -544,21 +543,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel 编译器'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-更新您的 `vite.config.ts` 以包含 `intlayerCompiler` 插件：
-
-```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 # 或 npm run dev

package/docs/zh/intlayer_with_astro_lit.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "Astro + Lit i18n - 翻译你的应用的完整指南"
 description: "告别 i18next。2026 年构建多语言 (i18n) Astro + Lit 应用的完整指南。使用 AI 代理翻译并优化包体积、SEO 和性能。"
 keywords:
@@ -20,6 +20,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 用法以直接访问属性"
@@ -151,7 +154,7 @@ bun add intlayer astro-intlayer lit lit-intlayer @astrojs/lit
   核心软件包，提供用于配置管理、翻译、[内容声明](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/dictionary/content_file.md)、编译和 [CLI 命令](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/cli/index.md)的国际化工具。
 
 - **astro-intlayer**
-  包含将 Intlayer 与 [Vite 构建器](https://vite.dev/guide/why.html#why-bundle-for-production)集成的 Astro 集成插件，以及用于检测用户首选语言、管理 Cookie 和处理 URL 重定向的中间件。
+  包含用于将 Intlayer 与 [Vite 打包器](https://vite.dev/guide/why.html#why-bundle-for-production) 集成的 Astro 集成插件、将每个请求的语言环境解析到 `Astro.locals.intlayer` 的中间件，以及 `useIntlayer` / `useDictionary` / `useLocale` 钩子。相同的导入路径在 `.astro` frontmatter 中解析为服务端实现，在 `<script>` 块中解析为客户端实现（由 `vanilla-intlayer` 支持）。
 
 - **lit**
   核心 Lit 软件包，用于构建快速且轻量级的 Web Components。
@@ -245,19 +248,21 @@ export default litDemoContent;
 </Step>
 <Step number={5} title="在 Astro 中使用内容">
 
-您可以使用 `intlayer` 导出的核心辅助函数直接在 `.astro` 文件中消费词典。您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接）。Lit 自定义元素通过客户端 `<script>` 导入并放置在 body 中。
+使用 `astro-intlayer` 导出的钩子在 `.astro` 文件中使用你的字典。它们与 `react-intlayer` 具有相同的签名：`useIntlayer("key")` 返回字典内容，`useLocale()` 返回当前语言环境，无需传递参数。
+
+语言环境来自 `astro-intlayer` 中间件，集成会自动在你的 `src/middleware.ts` 之前注册该中间件。它会依次从 URL 前缀、客户端持久化的语言环境（Cookie 或标头）、`Accept-Language` 解析每个请求的语言环境，并将其存储在 `Astro.locals.intlayer` 中。预渲染页面仅使用 URL，因为它们只为每个访客渲染一次。
+
+Lit 自定义元素通过客户端 `<script>` 导入并放置在 body 中。
 
 ```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";
 
 export const getStaticPaths = () => {
@@ -266,8 +271,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { greeting } = getIntlayer("lit-demo", locale);
+// 中间件解析的语言环境（例如 /zh/about -> 'zh'）
+const { locale } = useLocale();
+
+// 该语言环境的 'lit-demo' 字典内容
+const { greeting } = useIntlayer("lit-demo");
 ---
 
 <!doctype html>
@@ -326,6 +334,8 @@ const { greeting } = getIntlayer("lit-demo", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` 还向你自己的中间件和端点公开 `locale`、`defaultLocale` 和 `availableLocales`。将语言环境或选择器作为第二个参数传递（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）可在单次调用中覆盖请求语言环境。
+
 > **关于路由设置的说明：**
 > 您使用的目录结构取决于 `intlayer.config.ts` 中的 `middleware.routing` 设置：
 >
@@ -482,10 +492,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" },
@@ -585,21 +595,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel 编译器'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-更新您的 `vite.config.ts` 以包含 `intlayerCompiler` 插件：
-
-```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 # 或 npm run dev

package/docs/zh/intlayer_with_astro_preact.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "Astro + Preact i18n - 翻译你的应用的完整指南"
 description: "告别 i18next。2026 年构建多语言 (i18n) Astro + Preact 应用的完整指南。使用 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 preact preact-intlayer @astrojs/preact
   核心软件包，提供用于配置管理、翻译、[内容声明](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/dictionary/content_file.md)、编译和 [CLI 命令](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/cli/index.md)的国际化工具。
 
 - **astro-intlayer**
-  包含将 Intlayer 与 [Vite 构建器](https://vite.dev/guide/why.html#why-bundle-for-production)集成的 Astro 集成插件，以及用于检测用户首选语言、管理 Cookie 和处理 URL 重定向的中间件。
+  包含用于将 Intlayer 与 [Vite 打包器](https://vite.dev/guide/why.html#why-bundle-for-production) 集成的 Astro 集成插件、将每个请求的语言环境解析到 `Astro.locals.intlayer` 的中间件，以及 `useIntlayer` / `useDictionary` / `useLocale` 钩子。相同的导入路径在 `.astro` frontmatter 中解析为服务端实现，在 `<script>` 块中解析为客户端实现（由 `vanilla-intlayer` 支持）。
 
 - **preact**
   核心 Preact 软件包 - React 的快速且轻量级的替代方案。
@@ -242,19 +245,21 @@ export default appContent;
 </Step>
 <Step number={5} title="在 Astro 中使用内容">
 
-您可以使用 `intlayer` 导出的核心辅助函数直接在 `.astro` 文件中消费词典。您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 Preact 岛。
+使用 `astro-intlayer` 导出的钩子在 `.astro` 文件中使用你的字典。它们与 `react-intlayer` 具有相同的签名：`useIntlayer("key")` 返回字典内容，`useLocale()` 返回当前语言环境，无需传递参数。
+
+语言环境来自 `astro-intlayer` 中间件，集成会自动在你的 `src/middleware.ts` 之前注册该中间件。它会依次从 URL 前缀、客户端持久化的语言环境（Cookie 或标头）、`Accept-Language` 解析每个请求的语言环境，并将其存储在 `Astro.locals.intlayer` 中。预渲染页面仅使用 URL，因为它们只为每个访客渲染一次。
+
+您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 Preact 岛。
 
 ```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 { PreactIsland } from "../../components/preact/PreactIsland";
 
@@ -264,8 +269,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// 中间件解析的语言环境（例如 /zh/about -> 'zh'）
+const { locale } = useLocale();
+
+// 该语言环境的 'app' 字典内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -321,6 +329,8 @@ const { title } = getIntlayer("app", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` 还向你自己的中间件和端点公开 `locale`、`defaultLocale` 和 `availableLocales`。将语言环境或选择器作为第二个参数传递（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）可在单次调用中覆盖请求语言环境。
+
 > **关于路由设置的说明：**
 > 您使用的目录结构取决于 `intlayer.config.ts` 中的 `middleware.routing` 设置：
 >
@@ -437,10 +447,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 +550,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel 编译器'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-更新您的 `vite.config.ts` 以包含 `intlayerCompiler` 插件：
-
-```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 # 或 npm run dev

package/docs/zh/intlayer_with_astro_react.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-03-07
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 title: "Astro + React i18n - 翻译你的应用的完整指南"
 description: "告别 i18next。2026 年构建多语言 (i18n) Astro + React 应用的完整指南。使用 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 用法以直接访问属性"
@@ -153,7 +156,7 @@ bun add intlayer astro-intlayer react react-dom react-intlayer @astrojs/react
   核心软件包，提供用于配置管理、翻译、[内容声明](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/dictionary/content_file.md)、编译和 [CLI 命令](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/cli/index.md)的国际化工具。
 
 - **astro-intlayer**
-  包含将 Intlayer 与 [Vite 构建器](https://vite.dev/guide/why.html#why-bundle-for-production)集成的 Astro 集成插件，以及用于检测用户首选语言、管理 Cookie 和处理 URL 重定向的中间件。
+  包含用于将 Intlayer 与 [Vite 打包器](https://vite.dev/guide/why.html#why-bundle-for-production) 集成的 Astro 集成插件、将每个请求的语言环境解析到 `Astro.locals.intlayer` 的中间件，以及 `useIntlayer` / `useDictionary` / `useLocale` 钩子。相同的导入路径在 `.astro` frontmatter 中解析为服务端实现，在 `<script>` 块中解析为客户端实现（由 `vanilla-intlayer` 支持）。
 
 - **react**, **react-dom**
   在浏览器中渲染 React 组件所需的核心 React 软件包。
@@ -242,19 +245,21 @@ export default appContent;
 </Step>
 <Step number={5} title="在 Astro 中使用内容">
 
-您可以使用 `intlayer` 导出的核心辅助函数直接在 `.astro` 文件中消费词典。您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 React 岛。
+使用 `astro-intlayer` 导出的钩子在 `.astro` 文件中使用你的字典。它们与 `react-intlayer` 具有相同的签名：`useIntlayer("key")` 返回字典内容，`useLocale()` 返回当前语言环境，无需传递参数。
+
+语言环境来自 `astro-intlayer` 中间件，集成会自动在你的 `src/middleware.ts` 之前注册该中间件。它会依次从 URL 前缀、客户端持久化的语言环境（Cookie 或标头）、`Accept-Language` 解析每个请求的语言环境，并将其存储在 `Astro.locals.intlayer` 中。预渲染页面仅使用 URL，因为它们只为每个访客渲染一次。
+
+您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 React 岛。
 
 ```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 { ReactIsland } from "../../components/react/ReactIsland";
 
@@ -264,8 +269,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// 中间件解析的语言环境（例如 /zh/about -> 'zh'）
+const { locale } = useLocale();
+
+// 该语言环境的 'app' 字典内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -321,6 +329,8 @@ const { title } = getIntlayer("app", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` 还向你自己的中间件和端点公开 `locale`、`defaultLocale` 和 `availableLocales`。将语言环境或选择器作为第二个参数传递（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）可在单次调用中覆盖请求语言环境。
+
 > **关于路由设置的说明：**
 > 您使用的目录结构取决于 `intlayer.config.ts` 中的 `middleware.routing` 设置：
 >
@@ -433,10 +443,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" },
@@ -536,21 +546,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel 编译器'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-更新您的 `vite.config.ts` 以包含 `intlayerCompiler` 插件：
-
-```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 # 或 npm run dev

package/docs/zh/intlayer_with_astro_solid.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-24
-updatedAt: 2026-08-30
+updatedAt: 2026-09-20
 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/zh/dictionary/content_file.md)、编译和 [CLI 命令](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/cli/index.md)的国际化工具。
 
 - **astro-intlayer**
-  包含将 Intlayer 与 [Vite 构建器](https://vite.dev/guide/why.html#why-bundle-for-production)集成的 Astro 集成插件，以及用于检测用户首选语言、管理 Cookie 和处理 URL 重定向的中间件。
+  包含用于将 Intlayer 与 [Vite 打包器](https://vite.dev/guide/why.html#why-bundle-for-production) 集成的 Astro 集成插件、将每个请求的语言环境解析到 `Astro.locals.intlayer` 的中间件，以及 `useIntlayer` / `useDictionary` / `useLocale` 钩子。相同的导入路径在 `.astro` frontmatter 中解析为服务端实现，在 `<script>` 块中解析为客户端实现（由 `vanilla-intlayer` 支持）。
 
 - **solid-js**
   核心 Solid 软件包。
@@ -238,19 +241,21 @@ export default appContent;
 </Step>
 <Step number={5} title="在 Astro 中使用内容">
 
-您可以使用 `intlayer` 导出的核心辅助函数直接在 `.astro` 文件中消费词典。您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 Solid 岛。
+使用 `astro-intlayer` 导出的钩子在 `.astro` 文件中使用你的字典。它们与 `react-intlayer` 具有相同的签名：`useIntlayer("key")` 返回字典内容，`useLocale()` 返回当前语言环境，无需传递参数。
+
+语言环境来自 `astro-intlayer` 中间件，集成会自动在你的 `src/middleware.ts` 之前注册该中间件。它会依次从 URL 前缀、客户端持久化的语言环境（Cookie 或标头）、`Accept-Language` 解析每个请求的语言环境，并将其存储在 `Astro.locals.intlayer` 中。预渲染页面仅使用 URL，因为它们只为每个访客渲染一次。
+
+您还应在每个页面添加 SEO 元数据（如 hreflang 和规范链接），并为客户端交互内容引入 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 +265,11 @@ export const getStaticPaths = () => {
   }));
 };
 
-const locale = getLocaleFromPath(Astro.url.pathname) as LocalesValues;
-const { title } = getIntlayer("app", locale);
+// 中间件解析的语言环境（例如 /zh/about -> 'zh'）
+const { locale } = useLocale();
+
+// 该语言环境的 'app' 字典内容
+const { title } = useIntlayer("app");
 ---
 
 <!doctype html>
@@ -317,6 +325,8 @@ const { title } = getIntlayer("app", locale);
 > <img src={String(content.image.src)} alt={String(content.image)} />
 > ```
 
+> `Astro.locals.intlayer` 还向你自己的中间件和端点公开 `locale`、`defaultLocale` 和 `availableLocales`。将语言环境或选择器作为第二个参数传递（`useIntlayer("app", "fr")`、`useIntlayer("faq", { item: 2 })`）可在单次调用中覆盖请求语言环境。
+
 > **关于路由设置的说明：**
 > 您使用的目录结构取决于 `intlayer.config.ts` 中的 `middleware.routing` 设置：
 >
@@ -433,10 +443,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" },
@@ -536,21 +546,7 @@ bun x intlayer extract
  </Tab>
  <Tab value='Babel 编译器'>
 
-> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
-
-更新您的 `vite.config.ts` 以包含 `intlayerCompiler` 插件：
-
-```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 # 或 npm run dev