@intlayer/docs 6.1.5 → 6.1.6-canary.0

package/blog/tr/next-i18next_vs_next-intl_vs_intlayer.md

@@ -19,6 +19,8 @@ slugs:
 
 # next-i18next VS next-intl VS intlayer | Next.js Uluslararasılaştırma (i18n)
 
+![next-i18next VS next-intl VS intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/assets/i18next-next-intl-intlayer.png?raw=true)
+
 Bu rehber, **Next.js** için yaygın olarak kullanılan üç i18n seçeneğini karşılaştırır: **next-intl**, **next-i18next** ve **Intlayer**.
 **Next.js 13+ App Router**'a (React Server Components ile) odaklanıyoruz ve şunları değerlendiriyoruz:
 

package/blog/zh/next-i18next_vs_next-intl_vs_intlayer.md

@@ -19,6 +19,8 @@ slugs:
 
 # next-i18next VS next-intl VS intlayer | Next.js 国际化 (i18n)
 
+![next-i18next VS next-intl VS intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/assets/i18next-next-intl-intlayer.png?raw=true)
+
 让我们来看看 Next.js 的三种 i18n 方案：next-i18next、next-intl 和 Intlayer 之间的相似点和差异。
 
 这不是一个完整的教程，而是一个帮助你选择的比较。
@@ -173,9 +175,9 @@ Next.js 为你内置了国际化路由支持（例如区域段）。但该功能
 
 下面是使用 `intlayer` 在 vite + react 应用中进行包大小优化的影响示例：
 
-| 优化后的包                                                                             | 未优化的包                                                                                             |
-| -------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ |
-| ![优化后的包](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png) | ![未优化的包](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle_no_optimization.png) |
+| 优化后的包                                                                                      | 未优化的包                                                                                                      |
+| ----------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------- |
+| ![优化后的包](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true) | ![未优化的包](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle_no_optimization.png?raw=true) |
 
 ---
 
@@ -348,25 +350,25 @@ Next.js 为你内置了国际化路由支持（例如区域段）。但该功能
 
 ```bash
 .
-├── public
-│   └── locales
-│       ├── en
-│       │  ├── home.json
-│       │  └── navbar.json
-│       ├── fr
-│       │  ├── home.json
-│       │  └── navbar.json
-│       └── es
-│          ├── home.json
-│          └── navbar.json
-├── next-i18next.config.js
+├── i18n.config.ts
 └── src
-    ├── middleware.ts
+    ├── locales
+    │   ├── en
+    │   │  ├── common.json
+    │   │  └── about.json
+    │   └── fr
+    │      ├── common.json
+    │      └── about.json
     ├── app
-    │   └── home.tsx
+    │   ├── i18n
+    │   │   └── server.ts
+    │   └── [locale]
+    │       ├── layout.tsx
+    │       └── about.tsx
     └── components
-        └── Navbar
-            └── index.tsx
+        ├── I18nProvider.tsx
+        ├── ClientComponent.tsx
+        └── ServerComponent.tsx
 ```
 
   </TabItem>
@@ -374,6 +376,7 @@ Next.js 为你内置了国际化路由支持（例如区域段）。但该功能
 
 ```bash
 .
+├── i18n.ts
 ├── locales
 │   ├── en
 │   │  ├── home.json
@@ -384,11 +387,13 @@ Next.js 为你内置了国际化路由支持（例如区域段）。但该功能
 │   └── es
 │      ├── home.json
 │      └── navbar.json
-├── i18n.ts
 └── src
     ├── middleware.ts
     ├── app
-    │   └── home.tsx
+    │   ├── i18n
+    │   │   └── server.ts
+    │   └── [locale]
+    │       └── home.tsx
     └── components
         └── Navbar
             └── index.tsx
@@ -403,9 +408,11 @@ Next.js 为你内置了国际化路由支持（例如区域段）。但该功能
 └── src
     ├── middleware.ts
     ├── app
-    │   └── home
-    │       └── index.tsx
-    │       └── index.content.ts
+    │   └── [locale]
+    │       ├── layout.tsx
+    │       └── home
+    │           ├── index.tsx
+    │           └── index.content.ts
     └── components
         └── Navbar
             ├── index.tsx
@@ -533,8 +540,10 @@ export default async function LocaleLayout({
   const messages = await getMessages();
   const clientMessages = pick(messages, ["common", "about"]);
 
+  const rtlLocales = ["ar", "he", "fa", "ur"];
+
   return (
-    <html lang={locale}>
+    <html lang={locale} dir={rtlLocales.includes(locale) ? "rtl" : "ltr"}>
       <body>
         <NextIntlClientProvider locale={locale} messages={clientMessages}>
           {children}
@@ -851,10 +860,11 @@ const ServerComponent = ({ count }: ServerComponentProps) => {
 type ServerComponentProps = {
   count: number;
   t: (key: string) => string;
+  formatter: Intl.NumberFormat;
 };
 
-const ServerComponent = ({ t, count }: ServerComponentProps) => {
-  const formatted = new Intl.NumberFormat(i18n.language).format(count);
+const ServerComponent = ({ t, count, formatter }: ServerComponentProps) => {
+  const formatted = formatter.format(count);
 
   return (
     <div>
@@ -868,7 +878,7 @@ const ServerComponent = ({ t, count }: ServerComponentProps) => {
 > 由于服务器组件不能是异步的，因此需要将翻译函数和格式化函数作为属性传递。
 >
 > - `const t = await getTranslations("about.counter");`
-> - `const format = await getFormatter();`
+> - `const formatter = await getFormatter().then((formatter) => formatter.number());`
 
   </TabItem>
   <TabItem label="intlayer" value="intlayer">

package/dist/cjs/generated/docs.entry.cjs

@@ -75,6 +75,22 @@ const docsEntry = {
     hi: readLocale("autoFill.md", "hi"),
     tr: readLocale("autoFill.md", "tr")
   },
+  "./docs/en/component_i18n.md": {
+    en: readLocale("component_i18n.md", "en"),
+    fr: readLocale("component_i18n.md", "fr"),
+    ru: readLocale("component_i18n.md", "ru"),
+    ja: readLocale("component_i18n.md", "ja"),
+    ko: readLocale("component_i18n.md", "ko"),
+    zh: readLocale("component_i18n.md", "zh"),
+    es: readLocale("component_i18n.md", "es"),
+    de: readLocale("component_i18n.md", "de"),
+    ar: readLocale("component_i18n.md", "ar"),
+    pt: readLocale("component_i18n.md", "pt"),
+    "en-GB": readLocale("component_i18n.md", "en-GB"),
+    it: readLocale("component_i18n.md", "it"),
+    hi: readLocale("component_i18n.md", "hi"),
+    tr: readLocale("component_i18n.md", "tr")
+  },
   "./docs/en/configuration.md": {
     en: readLocale("configuration.md", "en"),
     fr: readLocale("configuration.md", "fr"),