@intlayer/docs 5.8.0-canary.0 → 5.8.1-canary.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (223) hide show
  1. package/blog/ar/intlayer_with_next-i18next.md +2 -2
  2. package/blog/ar/next-i18next_vs_next-intl_vs_intlayer.md +96 -219
  3. package/blog/ar/react-i18next_vs_react-intl_vs_intlayer.md +88 -129
  4. package/blog/ar/vue-i18n_vs_intlayer.md +268 -0
  5. package/blog/de/intlayer_with_next-i18next.md +2 -2
  6. package/blog/de/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  7. package/blog/de/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  8. package/blog/de/vue-i18n_vs_intlayer.md +268 -0
  9. package/blog/en/intlayer_with_next-i18next.md +2 -2
  10. package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  11. package/blog/en/react-i18next_vs_react-intl_vs_intlayer.md +88 -120
  12. package/blog/en/vue-i18n_vs_intlayer.md +276 -0
  13. package/blog/en-GB/intlayer_with_next-i18next.md +2 -2
  14. package/blog/en-GB/next-i18next_vs_next-intl_vs_intlayer.md +85 -218
  15. package/blog/en-GB/react-i18next_vs_react-intl_vs_intlayer.md +80 -130
  16. package/blog/en-GB/vue-i18n_vs_intlayer.md +258 -0
  17. package/blog/es/intlayer_with_next-i18next.md +2 -2
  18. package/blog/es/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  19. package/blog/es/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  20. package/blog/es/vue-i18n_vs_intlayer.md +268 -0
  21. package/blog/fr/intlayer_with_next-i18next.md +2 -2
  22. package/blog/fr/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
  23. package/blog/fr/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
  24. package/blog/fr/vue-i18n_vs_intlayer.md +269 -0
  25. package/blog/hi/intlayer_with_next-i18next.md +2 -2
  26. package/blog/hi/next-i18next_vs_next-intl_vs_intlayer.md +97 -220
  27. package/blog/hi/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
  28. package/blog/hi/vue-i18n_vs_intlayer.md +268 -0
  29. package/blog/it/intlayer_with_next-i18next.md +2 -2
  30. package/blog/it/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
  31. package/blog/it/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
  32. package/blog/it/vue-i18n_vs_intlayer.md +268 -0
  33. package/blog/ja/intlayer_with_next-i18next.md +2 -2
  34. package/blog/ja/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  35. package/blog/ja/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  36. package/blog/ja/vue-i18n_vs_intlayer.md +268 -0
  37. package/blog/ko/intlayer_with_next-i18next.md +2 -2
  38. package/blog/ko/next-i18next_vs_next-intl_vs_intlayer.md +95 -217
  39. package/blog/ko/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
  40. package/blog/ko/vue-i18n_vs_intlayer.md +268 -0
  41. package/blog/pt/intlayer_with_next-i18next.md +2 -2
  42. package/blog/pt/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  43. package/blog/pt/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  44. package/blog/pt/vue-i18n_vs_intlayer.md +268 -0
  45. package/blog/ru/intlayer_with_next-i18next.md +2 -2
  46. package/blog/ru/next-i18next_vs_next-intl_vs_intlayer.md +94 -217
  47. package/blog/ru/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  48. package/blog/ru/vue-i18n_vs_intlayer.md +268 -0
  49. package/blog/zh/intlayer_with_next-i18next.md +2 -2
  50. package/blog/zh/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
  51. package/blog/zh/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
  52. package/blog/zh/vue-i18n_vs_intlayer.md +269 -0
  53. package/dist/cjs/generated/blog.entry.cjs +41 -0
  54. package/dist/cjs/generated/blog.entry.cjs.map +1 -1
  55. package/dist/esm/generated/blog.entry.mjs +41 -0
  56. package/dist/esm/generated/blog.entry.mjs.map +1 -1
  57. package/dist/types/generated/blog.entry.d.ts +1 -0
  58. package/dist/types/generated/blog.entry.d.ts.map +1 -1
  59. package/docs/ar/formatters.md +417 -31
  60. package/docs/ar/how_works_intlayer.md +2 -4
  61. package/docs/ar/interest_of_intlayer.md +7 -10
  62. package/docs/ar/intlayer_CMS.md +2 -3
  63. package/docs/ar/intlayer_visual_editor.md +2 -3
  64. package/docs/ar/intlayer_with_tanstack.md +1 -1
  65. package/docs/ar/introduction.md +4 -4
  66. package/docs/de/formatters.md +444 -34
  67. package/docs/de/introduction.md +2 -2
  68. package/docs/en/dictionary/enumeration.md +2 -2
  69. package/docs/en/dictionary/function_fetching.md +2 -2
  70. package/docs/en/dictionary/get_started.md +2 -2
  71. package/docs/en/dictionary/translation.md +2 -2
  72. package/docs/en/formatters.md +383 -15
  73. package/docs/en/how_works_intlayer.md +2 -4
  74. package/docs/en/interest_of_intlayer.md +48 -29
  75. package/docs/en/intlayer_CMS.md +2 -3
  76. package/docs/en/intlayer_visual_editor.md +2 -3
  77. package/docs/en/intlayer_with_create_react_app.md +2 -2
  78. package/docs/en/intlayer_with_express.md +2 -2
  79. package/docs/en/intlayer_with_tanstack.md +1 -1
  80. package/docs/en/introduction.md +4 -4
  81. package/docs/en/packages/express-intlayer/index.md +2 -2
  82. package/docs/en/packages/intlayer/getConfiguration.md +2 -3
  83. package/docs/en/packages/intlayer/getEnumeration.md +2 -7
  84. package/docs/en/packages/intlayer/getHTMLTextDir.md +2 -4
  85. package/docs/en/packages/intlayer/getLocaleLang.md +2 -4
  86. package/docs/en/packages/intlayer/getLocaleName.md +2 -3
  87. package/docs/en/packages/intlayer/getLocalizedUrl.md +2 -8
  88. package/docs/en/packages/intlayer/getMultilingualUrls.md +2 -7
  89. package/docs/en/packages/intlayer/getPathWithoutLocale.md +2 -3
  90. package/docs/en/packages/intlayer/getTranslation.md +2 -4
  91. package/docs/en/packages/intlayer/index.md +2 -2
  92. package/docs/en/packages/next-intlayer/index.md +2 -2
  93. package/docs/en/packages/next-intlayer/t.md +2 -2
  94. package/docs/en/packages/next-intlayer/useDictionary.md +2 -2
  95. package/docs/en/packages/next-intlayer/useIntlayer.md +2 -2
  96. package/docs/en/packages/next-intlayer/useLocale.md +2 -2
  97. package/docs/en/packages/react-intlayer/index.md +2 -2
  98. package/docs/en/packages/react-intlayer/t.md +2 -2
  99. package/docs/en/packages/react-intlayer/useI18n.md +2 -2
  100. package/docs/en/packages/react-intlayer/useIntlayer.md +2 -2
  101. package/docs/en/packages/react-intlayer/useLocale.md +2 -2
  102. package/docs/en/packages/react-scripts-intlayer/index.md +2 -2
  103. package/docs/en/packages/solid-intlayer/index.md +2 -2
  104. package/docs/en/packages/vite-intlayer/index.md +2 -2
  105. package/docs/en-GB/formatters.md +402 -16
  106. package/docs/en-GB/how_works_intlayer.md +2 -4
  107. package/docs/en-GB/interest_of_intlayer.md +7 -10
  108. package/docs/en-GB/intlayer_with_tanstack.md +1 -1
  109. package/docs/en-GB/introduction.md +2 -2
  110. package/docs/es/formatters.md +438 -28
  111. package/docs/es/how_works_intlayer.md +2 -4
  112. package/docs/es/interest_of_intlayer.md +7 -10
  113. package/docs/es/intlayer_with_tanstack.md +1 -1
  114. package/docs/es/introduction.md +2 -2
  115. package/docs/fr/formatters.md +438 -28
  116. package/docs/fr/how_works_intlayer.md +2 -4
  117. package/docs/fr/interest_of_intlayer.md +7 -10
  118. package/docs/fr/intlayer_with_tanstack.md +1 -1
  119. package/docs/fr/introduction.md +2 -2
  120. package/docs/hi/formatters.md +430 -39
  121. package/docs/hi/how_works_intlayer.md +2 -4
  122. package/docs/hi/interest_of_intlayer.md +7 -10
  123. package/docs/hi/intlayer_with_tanstack.md +1 -1
  124. package/docs/hi/introduction.md +2 -2
  125. package/docs/it/formatters.md +438 -30
  126. package/docs/it/how_works_intlayer.md +2 -4
  127. package/docs/it/interest_of_intlayer.md +7 -10
  128. package/docs/it/intlayer_with_tanstack.md +1 -1
  129. package/docs/it/introduction.md +2 -2
  130. package/docs/ja/formatters.md +435 -47
  131. package/docs/ja/how_works_intlayer.md +2 -4
  132. package/docs/ja/interest_of_intlayer.md +7 -10
  133. package/docs/ja/intlayer_with_tanstack.md +1 -1
  134. package/docs/ja/introduction.md +2 -2
  135. package/docs/ko/formatters.md +432 -41
  136. package/docs/ko/how_works_intlayer.md +2 -4
  137. package/docs/ko/interest_of_intlayer.md +7 -10
  138. package/docs/ko/intlayer_with_tanstack.md +1 -1
  139. package/docs/ko/introduction.md +2 -2
  140. package/docs/pt/formatters.md +416 -30
  141. package/docs/pt/how_works_intlayer.md +2 -4
  142. package/docs/pt/intlayer_with_tanstack.md +1 -1
  143. package/docs/pt/introduction.md +2 -2
  144. package/docs/ru/autoFill.md +2 -2
  145. package/docs/ru/configuration.md +1 -40
  146. package/docs/ru/formatters.md +438 -28
  147. package/docs/ru/how_works_intlayer.md +5 -7
  148. package/docs/ru/index.md +1 -1
  149. package/docs/ru/interest_of_intlayer.md +8 -11
  150. package/docs/ru/intlayer_CMS.md +7 -8
  151. package/docs/ru/intlayer_cli.md +4 -7
  152. package/docs/ru/intlayer_visual_editor.md +5 -6
  153. package/docs/ru/intlayer_with_angular.md +1 -1
  154. package/docs/ru/intlayer_with_create_react_app.md +5 -5
  155. package/docs/ru/intlayer_with_lynx+react.md +1 -1
  156. package/docs/ru/intlayer_with_nextjs_15.md +3 -3
  157. package/docs/ru/intlayer_with_nextjs_page_router.md +2 -2
  158. package/docs/ru/intlayer_with_nuxt.md +1 -1
  159. package/docs/ru/intlayer_with_react_native+expo.md +2 -2
  160. package/docs/ru/intlayer_with_tanstack.md +3 -3
  161. package/docs/ru/intlayer_with_vite+preact.md +3 -3
  162. package/docs/ru/intlayer_with_vite+react.md +3 -3
  163. package/docs/ru/intlayer_with_vite+solid.md +1 -1
  164. package/docs/ru/intlayer_with_vite+svelte.md +1 -1
  165. package/docs/ru/intlayer_with_vite+vue.md +2 -2
  166. package/docs/ru/introduction.md +5 -5
  167. package/docs/ru/locale_mapper.md +1 -1
  168. package/docs/ru/packages/@intlayer/api/index.md +2 -2
  169. package/docs/ru/packages/@intlayer/chokidar/index.md +1 -1
  170. package/docs/ru/packages/@intlayer/cli/index.md +2 -2
  171. package/docs/ru/packages/@intlayer/config/index.md +2 -2
  172. package/docs/ru/packages/@intlayer/core/index.md +2 -2
  173. package/docs/ru/packages/@intlayer/design-system/index.md +2 -2
  174. package/docs/ru/packages/@intlayer/dictionary-entry/index.md +2 -2
  175. package/docs/ru/packages/@intlayer/editor/index.md +1 -1
  176. package/docs/ru/packages/@intlayer/editor-react/index.md +1 -1
  177. package/docs/ru/packages/@intlayer/webpack/index.md +1 -1
  178. package/docs/ru/packages/angular-intlayer/index.md +1 -1
  179. package/docs/ru/packages/express-intlayer/index.md +3 -3
  180. package/docs/ru/packages/express-intlayer/t.md +1 -1
  181. package/docs/ru/packages/intlayer/getEnumeration.md +3 -8
  182. package/docs/ru/packages/intlayer/getTranslation.md +3 -5
  183. package/docs/ru/packages/intlayer/getTranslationContent.md +1 -3
  184. package/docs/ru/packages/intlayer/index.md +3 -3
  185. package/docs/ru/packages/intlayer-cli/index.md +1 -1
  186. package/docs/ru/packages/intlayer-editor/index.md +2 -2
  187. package/docs/ru/packages/lynx-intlayer/index.md +1 -1
  188. package/docs/ru/packages/next-intlayer/index.md +4 -4
  189. package/docs/ru/packages/next-intlayer/t.md +4 -4
  190. package/docs/ru/packages/next-intlayer/useLocale.md +3 -3
  191. package/docs/ru/packages/nuxt-intlayer/index.md +1 -1
  192. package/docs/ru/packages/preact-intlayer/index.md +1 -1
  193. package/docs/ru/packages/react-intlayer/index.md +4 -4
  194. package/docs/ru/packages/react-intlayer/t.md +4 -4
  195. package/docs/ru/packages/react-native-intlayer/index.md +1 -1
  196. package/docs/ru/packages/react-scripts-intlayer/index.md +3 -3
  197. package/docs/ru/packages/solid-intlayer/index.md +3 -3
  198. package/docs/ru/packages/svelte-intlayer/index.md +1 -1
  199. package/docs/ru/packages/vite-intlayer/index.md +3 -3
  200. package/docs/ru/packages/vue-intlayer/index.md +1 -1
  201. package/docs/ru/per_locale_file.md +1 -1
  202. package/docs/ru/roadmap.md +3 -5
  203. package/docs/ru/vs_code_extension.md +1 -1
  204. package/docs/zh/formatters.md +446 -38
  205. package/docs/zh/how_works_intlayer.md +2 -4
  206. package/docs/zh/interest_of_intlayer.md +7 -10
  207. package/docs/zh/intlayer_with_tanstack.md +1 -1
  208. package/docs/zh/introduction.md +2 -2
  209. package/frequent_questions/ar/domain_routing.md +1 -1
  210. package/frequent_questions/en/domain_routing.md +1 -1
  211. package/frequent_questions/en-GB/domain_routing.md +1 -1
  212. package/frequent_questions/es/domain_routing.md +1 -1
  213. package/frequent_questions/fr/domain_routing.md +1 -1
  214. package/frequent_questions/hi/domain_routing.md +1 -1
  215. package/frequent_questions/it/domain_routing.md +1 -1
  216. package/frequent_questions/ko/domain_routing.md +1 -1
  217. package/frequent_questions/pt/domain_routing.md +1 -1
  218. package/frequent_questions/ru/domain_routing.md +1 -1
  219. package/frequent_questions/ru/get_locale_cookie.md +4 -4
  220. package/frequent_questions/ru/static_rendering.md +1 -2
  221. package/frequent_questions/zh/domain_routing.md +1 -1
  222. package/package.json +9 -11
  223. package/src/generated/blog.entry.ts +42 -1
@@ -2,7 +2,7 @@
2
2
  createdAt: 2024-08-13
3
3
  updatedAt: 2025-08-20
4
4
  title: 格式化工具
5
- description: 基于 Intl 的本地化格式化工具,用于数字、百分比、货币、日期、相对时间、单位和紧凑表示。包含缓存的 Intl 辅助工具。
5
+ description: 基于 Intl 的本地化格式化工具,支持数字、百分比、货币、日期、相对时间、单位和紧凑表示法。包含缓存的 Intl 辅助工具。
6
6
  keywords:
7
7
  - 格式化工具
8
8
  - Intl
@@ -12,7 +12,8 @@ keywords:
12
12
  - 日期
13
13
  - 相对时间
14
14
  - 单位
15
- - 紧凑表示
15
+ - 紧凑
16
+ - 列表
16
17
  - 国际化
17
18
  slugs:
18
19
  - doc
@@ -23,7 +24,7 @@ slugs:
23
24
 
24
25
  ## 概述
25
26
 
26
- Intlayer 提供了一组基于原生 `Intl` API 构建的轻量级辅助工具,以及一个缓存的 `Intl` 包装器,以避免重复构造重量级的格式化器。这些工具完全支持本地化,可直接从主 `intlayer` 包中使用。
27
+ Intlayer 提供了一组基于原生 `Intl` API 构建的轻量级辅助工具,以及一个缓存的 `Intl` 包装器,避免重复构建重量级的格式化器。这些工具完全支持本地化,可以直接从主 `intlayer` 包中使用。
27
28
 
28
29
  ### 导入
29
30
 
@@ -37,34 +38,296 @@ import {
37
38
  relativeTime,
38
39
  units,
39
40
  compact,
41
+ list,
42
+ getLocaleName,
43
+ getLocaleLang,
44
+ getLocaleFromPath,
45
+ getPathWithoutLocale,
46
+ getLocalizedUrl,
47
+ getHTMLTextDir,
48
+ getContent,
49
+ getLocalisedContent,
50
+ getTranslation,
51
+ getIntlayer,
52
+ getIntlayerAsync,
40
53
  } from "intlayer";
41
54
  ```
42
55
 
43
- 如果您使用 React,也提供了 hooks;请参见 `react-intlayer/format`。
56
+ 如果您使用 React,也可以使用 hooks;请参见 `react-intlayer/format`。
44
57
 
45
58
  ## 缓存的 Intl
46
59
 
47
- 导出的 `Intl` 是对全局 `Intl` 的一个轻量缓存包装器。它会缓存 `NumberFormat`、`DateTimeFormat`、`RelativeTimeFormat` 的实例,避免重复构建相同的格式化器。
60
+ 导出的 `Intl` 是对全局 `Intl` 的一个轻量级缓存包装器。它会缓存 `NumberFormat`、`DateTimeFormat`、`RelativeTimeFormat`、`ListFormat`、`DisplayNames`、`Collator` 和 `PluralRules` 的实例,从而避免重复构建相同的格式化器。
48
61
 
49
- 由于格式化器的构造相对昂贵,这种缓存机制在不改变行为的前提下提升了性能。该包装器暴露与原生 `Intl` 相同的 API,因此用法完全一致。
62
+ 由于格式化器的构建相对昂贵,这种缓存机制在不改变行为的情况下提升了性能。该包装器暴露了与原生 `Intl` 相同的 API,因此用法完全一致。
50
63
 
51
64
  - 缓存是按进程进行的,对调用者透明。
52
65
 
53
- > 如果环境中不支持 `Intl.DisplayNames`,则会打印一次仅限开发环境的警告(建议使用 polyfill)。
66
+ > 如果环境中不支持 `Intl.DisplayNames`,则只会打印一次仅限开发者的警告(建议使用 polyfill)。
54
67
 
55
68
  示例:
56
69
 
57
70
  ```ts
58
71
  import { Intl } from "intlayer";
59
72
 
73
+ // 数字格式化
60
74
  const numberFormat = new Intl.NumberFormat("en-GB", {
61
75
  style: "currency",
62
76
  currency: "GBP",
63
77
  });
64
78
  numberFormat.format(1234.5); // "£1,234.50"
79
+
80
+ // 语言、地区等的显示名称
81
+ const displayNames = new Intl.DisplayNames("fr", { type: "language" });
82
+ displayNames.of("en"); // "anglais"
83
+
84
+ // 用于排序的比较器
85
+ const collator = new Intl.Collator("fr", { sensitivity: "base" });
86
+ collator.compare("é", "e"); // 0(相等)
87
+
88
+ // 复数规则
89
+ const pluralRules = new Intl.PluralRules("fr");
90
+ pluralRules.select(1); // "one"
91
+ pluralRules.select(2); // "other"
92
+ ```
93
+
94
+ ## 额外的 Intl 工具
95
+
96
+ 除了格式化辅助工具外,您还可以直接使用缓存的 Intl 包装器来使用其他 Intl 功能:
97
+
98
+ ### `Intl.DisplayNames`
99
+
100
+ 用于获取语言、地区、货币和书写系统的本地化名称:
101
+
102
+ ```ts
103
+ import { Intl } from "intlayer";
104
+
105
+ const languageNames = new Intl.DisplayNames("en", { type: "language" });
106
+ languageNames.of("fr"); // "French"
107
+
108
+ const regionNames = new Intl.DisplayNames("fr", { type: "region" });
109
+ regionNames.of("US"); // "États-Unis"
110
+ ```
111
+
112
+ ### `Intl.Collator`
113
+
114
+ 用于基于区域设置的字符串比较和排序:
115
+
116
+ ```ts
117
+ import { Intl } from "intlayer";
118
+
119
+ const collator = new Intl.Collator("de", {
120
+ sensitivity: "base",
121
+ numeric: true,
122
+ });
123
+
124
+ const words = ["äpfel", "zebra", "100", "20"];
125
+ words.sort(collator.compare); // ["20", "100", "äpfel", "zebra"]
126
+ ```
127
+
128
+ ### `Intl.PluralRules`
129
+
130
+ 用于确定不同区域设置中的复数形式:
131
+
132
+ ```ts
133
+ import { Intl } from "intlayer";
134
+
135
+ const pluralRules = new Intl.PluralRules("ar");
136
+ pluralRules.select(0); // "zero"
137
+ pluralRules.select(1); // "one"
138
+ pluralRules.select(2); // "two"
139
+ pluralRules.select(3); // "few"
140
+ pluralRules.select(11); // "many"
141
+ ```
142
+
143
+ ## 区域设置工具
144
+
145
+ ### `getLocaleName(displayLocale, targetLocale?)`
146
+
147
+ 获取某个区域设置在另一种区域设置中的本地化名称:
148
+
149
+ ```ts
150
+ import { getLocaleName } from "intlayer";
151
+
152
+ getLocaleName("fr", "en"); // "French"
153
+ getLocaleName("en", "fr"); // "anglais"
154
+ getLocaleName("de", "es"); // "alemán"
155
+ ```
156
+
157
+ - **displayLocale**: 要获取名称的语言环境
158
+ - **targetLocale**: 用于显示名称的语言环境(默认为 displayLocale)
159
+
160
+ ### `getLocaleLang(locale?)`
161
+
162
+ 从语言环境字符串中提取语言代码:
163
+
164
+ ```ts
165
+ import { getLocaleLang } from "intlayer";
166
+
167
+ getLocaleLang("en-US"); // "en"
168
+ getLocaleLang("fr-CA"); // "fr"
169
+ getLocaleLang("de"); // "de"
170
+ ```
171
+
172
+ - **locale**: 要提取语言代码的语言环境(默认为当前语言环境)
173
+
174
+ ### `getLocaleFromPath(inputUrl)`
175
+
176
+ 从 URL 或路径名中提取语言环境段:
177
+
178
+ ```ts
179
+ import { getLocaleFromPath } from "intlayer";
180
+
181
+ getLocaleFromPath("/en/dashboard"); // "en"
182
+ getLocaleFromPath("/fr/dashboard"); // "fr"
183
+ getLocaleFromPath("/dashboard"); // "en"(默认语言环境)
184
+ getLocaleFromPath("https://example.com/es/about"); // "es"
185
+ ```
186
+
187
+ - **inputUrl**:要处理的完整 URL 字符串或路径名
188
+ - **returns**:检测到的语言环境,如果未找到语言环境则返回默认语言环境
189
+
190
+ ### `getPathWithoutLocale(inputUrl, locales?)`
191
+
192
+ 从 URL 或路径名中移除语言环境段:
193
+
194
+ ```ts
195
+ import { getPathWithoutLocale } from "intlayer";
196
+
197
+ getPathWithoutLocale("/en/dashboard"); // "/dashboard"
198
+ getPathWithoutLocale("/fr/dashboard"); // "/dashboard"
199
+ getPathWithoutLocale("https://example.com/en/about"); // "https://example.com/about"
200
+ ```
201
+
202
+ - **inputUrl**:要处理的完整 URL 字符串或路径名
203
+ - **locales**:可选的支持语言数组(默认为配置的语言)
204
+ - **returns**:去除语言段后的 URL
205
+
206
+ ### `getLocalizedUrl(url, currentLocale, locales?, defaultLocale?, prefixDefault?)`
207
+
208
+ 为当前语言生成本地化 URL:
209
+
210
+ ```ts
211
+ import { getLocalizedUrl } from "intlayer";
212
+
213
+ getLocalizedUrl("/about", "fr", ["en", "fr"], "en", false); // "/fr/about"
214
+ getLocalizedUrl("/about", "en", ["en", "fr"], "en", false); // "/about"
215
+ getLocalizedUrl("https://example.com/about", "fr", ["en", "fr"], "en", true); // "https://example.com/fr/about"
216
+ ```
217
+
218
+ - **url**:要本地化的原始 URL
219
+ - **currentLocale**:当前语言
220
+ - **locales**:可选的支持语言数组(默认为配置的语言)
221
+ - **defaultLocale**:可选的默认语言环境(默认为配置的默认语言环境)
222
+ - **prefixDefault**:是否为默认语言环境添加前缀(默认为配置值)
223
+
224
+ ### `getHTMLTextDir(locale?)`
225
+
226
+ 返回指定语言环境的文本方向:
227
+
228
+ ```ts
229
+ import { getHTMLTextDir } from "intlayer";
230
+
231
+ getHTMLTextDir("en-US"); // "ltr"
232
+ getHTMLTextDir("ar"); // "rtl"
233
+ getHTMLTextDir("he"); // "rtl"
234
+ ```
235
+
236
+ - **locale**:要获取文本方向的语言环境(默认为当前语言环境)
237
+ - **returns**:返回 `"ltr"`、`"rtl"` 或 `"auto"`
238
+
239
+ ## 内容处理工具
240
+
241
+ ### `getContent(node, nodeProps, locale?)`
242
+
243
+ 使用所有可用插件(翻译、枚举、插入等)转换内容节点:
244
+
245
+ ```ts
246
+ import { getContent } from "intlayer";
247
+
248
+ const content = getContent(
249
+ contentNode,
250
+ { dictionaryKey: "common", dictionaryPath: "/path/to/dict" },
251
+ "fr"
252
+ );
65
253
  ```
66
254
 
67
- ## 格式化器
255
+ - **node**:要转换的内容节点
256
+ - **nodeProps**:转换上下文的属性
257
+ - **locale**:可选的语言环境(默认为配置的默认语言环境)
258
+
259
+ ### `getLocalisedContent(node, locale, nodeProps, fallback?)`
260
+
261
+ 仅使用翻译插件转换内容节点:
262
+
263
+ ```ts
264
+ import { getLocalisedContent } from "intlayer";
265
+
266
+ const content = getLocalisedContent(
267
+ contentNode,
268
+ "fr",
269
+ { dictionaryKey: "common" },
270
+ true // 如果缺少翻译则回退到默认语言环境
271
+ );
272
+ ```
273
+
274
+ - **node**:要转换的内容节点
275
+ - **locale**:用于翻译的语言环境
276
+ - **nodeProps**:转换上下文的属性
277
+ - **fallback**:是否回退到默认语言环境(默认为 false)
278
+
279
+ ### `getTranslation(languageContent, locale?, fallback?)`
280
+
281
+ 从语言内容对象中提取特定语言环境的内容:
282
+
283
+ ```ts
284
+ import { getTranslation } from "intlayer";
285
+
286
+ const content = getTranslation(
287
+ {
288
+ en: "Hello",
289
+ fr: "Bonjour",
290
+ de: "Hallo",
291
+ },
292
+ "fr",
293
+ true
294
+ ); // "Bonjour"
295
+ ```
296
+
297
+ - **languageContent**:映射语言环境到内容的对象
298
+ - **locale**:目标语言环境(默认为配置的默认语言环境)
299
+ - **fallback**:是否回退到默认语言环境(默认为 true)
300
+
301
+ ### `getIntlayer(dictionaryKey, locale?, plugins?)`
302
+
303
+ 通过键检索并转换字典中的内容:
304
+
305
+ ```ts
306
+ import { getIntlayer } from "intlayer";
307
+
308
+ const content = getIntlayer("common", "fr");
309
+ const nestedContent = getIntlayer("common", "fr", customPlugins);
310
+ ```
311
+
312
+ - **dictionaryKey**:要检索的字典键
313
+ - **locale**:可选的语言环境(默认为配置的默认语言环境)
314
+ - **plugins**:可选的自定义转换插件数组
315
+
316
+ ### `getIntlayerAsync(dictionaryKey, locale?, plugins?)`
317
+
318
+ 异步从远程字典中检索内容:
319
+
320
+ ```ts
321
+ import { getIntlayerAsync } from "intlayer";
322
+
323
+ const content = await getIntlayerAsync("common", "fr");
324
+ ```
325
+
326
+ - **dictionaryKey**:要检索的字典键
327
+ - **locale**:可选的语言环境(默认为配置的默认语言环境)
328
+ - **plugins**:可选的自定义转换插件数组
329
+
330
+ ## 格式化工具
68
331
 
69
332
  以下所有辅助函数均从 `intlayer` 导出。
70
333
 
@@ -81,7 +344,7 @@ numberFormat.format(1234.5); // "£1,234.50"
81
344
  import { number } from "intlayer";
82
345
 
83
346
  number(123456.789); // "123,456.789"(在 en-US 中)
84
- number("1000000", { locale: "fr" }); // "1000000"
347
+ number("1000000", { locale: "fr" }); // "1 000 000"
85
348
  number(1234.5, { minimumFractionDigits: 2 }); // "1,234.50"
86
349
  ```
87
350
 
@@ -89,7 +352,7 @@ number(1234.5, { minimumFractionDigits: 2 }); // "1,234.50"
89
352
 
90
353
  将数字格式化为百分比字符串。
91
354
 
92
- 行为:大于1的值被解释为完整的百分比并进行归一化(例如,`25` → `25%`,`0.25` → `25%`)。
355
+ 行为:大于 1 的值被解释为完整的百分比并进行归一化(例如,`25` → `25%`,`0.25` → `25%`)。
93
356
 
94
357
  - **value**: `number | string`
95
358
  - **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
@@ -106,7 +369,7 @@ percentage(0.237, { minimumFractionDigits: 1 }); // "23.7%"
106
369
 
107
370
  ### `currency(value, options?)`
108
371
 
109
- 将值格式化为本地化货币。默认使用带有两位小数的 `USD`。
372
+ 将数值格式化为本地化货币。默认使用 `USD`,保留两位小数。
110
373
 
111
374
  - **value**: `number | string`
112
375
  - **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
@@ -118,7 +381,7 @@ percentage(0.237, { minimumFractionDigits: 1 }); // "23.7%"
118
381
  import { currency } from "intlayer";
119
382
 
120
383
  currency(1234.5, { currency: "EUR" }); // "€1,234.50"
121
- currency("5000", { locale: "fr", currency: "CAD", currencyDisplay: "code" }); // "5000,00 CAD"
384
+ currency("5000", { locale: "fr", currency: "CAD", currencyDisplay: "code" }); // "5 000,00 CAD"
122
385
  ```
123
386
 
124
387
  ### `date(date, optionsOrPreset?)`
@@ -126,7 +389,7 @@ currency("5000", { locale: "fr", currency: "CAD", currencyDisplay: "code" }); //
126
389
  使用 `Intl.DateTimeFormat` 格式化日期/时间值。
127
390
 
128
391
  - **date**: `Date | string | number`
129
- - **optionsOrPreset**: `Intl.DateTimeFormatOptions & { locale?: LocalesValues }` 或预设之一:
392
+ - **optionsOrPreset**: `Intl.DateTimeFormatOptions & { locale?: LocalesValues }` 或者以下预设之一:
130
393
  - 预设值: `"short" | "long" | "dateOnly" | "timeOnly" | "full"`
131
394
 
132
395
  示例:
@@ -134,7 +397,7 @@ currency("5000", { locale: "fr", currency: "CAD", currencyDisplay: "code" }); //
134
397
  ```ts
135
398
  import { date } from "intlayer";
136
399
 
137
- date(new Date(), "short"); // 例如 "08/02/25, 14:30"
400
+ date(new Date(), "short"); // 例如,"08/02/25, 14:30"
138
401
  date("2025-08-02T14:30:00Z", { locale: "fr", month: "long", day: "numeric" }); // "2 août"
139
402
  ```
140
403
 
@@ -142,11 +405,11 @@ date("2025-08-02T14:30:00Z", { locale: "fr", month: "long", day: "numeric" }); /
142
405
 
143
406
  使用 `Intl.RelativeTimeFormat` 格式化两个时间点之间的相对时间。
144
407
 
145
- - 传入 "now" 作为第一个参数,目标时间作为第二个参数,以获得自然的表达方式。
408
+ - 传入 "now" 作为第一个参数,目标时间作为第二个参数,可以获得自然的表达方式。
146
409
  - **from**: `Date | string | number`
147
410
  - **to**: `Date | string | number`(默认为 `new Date()`)
148
411
  - **options**: `{ locale?: LocalesValues; unit?: Intl.RelativeTimeFormatUnit; numeric?: Intl.RelativeTimeFormatNumeric; style?: Intl.RelativeTimeFormatStyle }`
149
- - 默认的 `unit` `"second"`。
412
+ - 默认 `unit` `"second"`。
150
413
 
151
414
  示例:
152
415
 
@@ -163,11 +426,11 @@ relativeTime(now, twoHoursAgo, { unit: "hour", numeric: "auto" }); // "2 hours a
163
426
 
164
427
  ### `units(value, options?)`
165
428
 
166
- 使用 `Intl.NumberFormat` 并设置 `style: 'unit'` 将数值格式化为本地化的单位字符串。
429
+ 使用 `Intl.NumberFormat` `style: 'unit'` 将数值格式化为本地化的单位字符串。
167
430
 
168
431
  - **value**: `number | string`
169
432
  - **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`
170
- - 常用字段:`unit`(例如 `"kilometer"`、`"byte"`),`unitDisplay`(`"short" | "narrow" | "long"`)
433
+ - 常用字段:`unit`(例如 `"kilometer"`,`"byte"`),`unitDisplay`(`"short" | "narrow" | "long"`)
171
434
  - 默认值:`unit: 'day'`,`unitDisplay: 'short'`,`useGrouping: false`
172
435
 
173
436
  示例:
@@ -181,10 +444,10 @@ units(1024, { unit: "byte", unitDisplay: "narrow" }); // "1,024B"(依赖于区
181
444
 
182
445
  ### `compact(value, options?)`
183
446
 
184
- 使用紧凑表示法格式化数字(例如 `1.2K`,`1M`)。
447
+ 使用紧凑表示法格式化数字(例如,`1.2K`,`1M`)。
185
448
 
186
- - **value**: `number | string`
187
- /// **options**: `Intl.NumberFormatOptions & { locale?: LocalesValues }`(底层使用 `notation: 'compact'`)
449
+ - **value**:`number | string`
450
+ - **options**:`Intl.NumberFormatOptions & { locale?: LocalesValues }`(内部使用 `notation: 'compact'`)
188
451
 
189
452
  示例:
190
453
 
@@ -195,45 +458,190 @@ compact(1200); // "1.2K"
195
458
  compact("1000000", { locale: "fr", compactDisplay: "long" }); // "1 million"
196
459
  ```
197
460
 
461
+ ### `list(values, options?)`
462
+
463
+ 使用 `Intl.ListFormat` 将值数组格式化为本地化的列表字符串。
464
+
465
+ - **values**: `(string | number)[]`
466
+ - **options**: `Intl.ListFormatOptions & { locale?: LocalesValues }`
467
+ - 常用字段:`type`(`"conjunction" | "disjunction" | "unit"`),`style`(`"long" | "short" | "narrow"`)
468
+ - 默认值:`type: 'conjunction'`,`style: 'long'`
469
+
470
+ 示例:
471
+
472
+ ```ts
473
+ import { list } from "intlayer";
474
+
475
+ list(["apple", "banana", "orange"]); // "apple, banana, and orange"
476
+ list(["red", "green", "blue"], { locale: "fr", type: "disjunction" }); // "rouge, vert ou bleu"
477
+ list([1, 2, 3], { type: "unit" }); // "1, 2, 3"
478
+ ```
479
+
198
480
  ## 说明
199
481
 
200
- - 所有辅助函数均接受 `string` 类型输入;内部会强制转换为数字或日期。
201
- - 如果未提供 locale,则默认使用您配置的 `internationalization.defaultLocale`。
202
- - 这些工具是轻量封装;如需高级格式化,请直接传递标准的 `Intl` 选项。
482
+ - 所有辅助函数都接受 `string` 类型的输入;它们会在内部被强制转换为数字或日期。
483
+ - 如果未提供,区域设置默认使用您配置的 `internationalization.defaultLocale`。
484
+ - 这些工具是轻量封装;对于高级格式化,请直接传递标准的 `Intl` 选项。
203
485
 
204
- ## 入口点及重新导出(`@index.ts`)
486
+ ## 入口点和重新导出(`@index.ts`)
205
487
 
206
- 格式化函数位于核心包中,并从更高级别的包中重新导出,以保持跨运行时的导入简洁:
488
+ 格式化函数位于核心包中,并从更高级的包中重新导出,以保持跨运行时的导入简洁:
207
489
 
208
490
  示例:
209
491
 
210
492
  ```ts
211
493
  // 应用代码(推荐)
212
- import { number, currency, date, Intl } from "intlayer";
494
+ import {
495
+ number,
496
+ currency,
497
+ date,
498
+ relativeTime,
499
+ units,
500
+ compact,
501
+ list,
502
+ Intl,
503
+ getLocaleName,
504
+ getLocaleLang,
505
+ getLocaleFromPath,
506
+ getPathWithoutLocale,
507
+ getLocalizedUrl,
508
+ getHTMLTextDir,
509
+ getContent,
510
+ getLocalisedContent,
511
+ getTranslation,
512
+ getIntlayer,
513
+ getIntlayerAsync,
514
+ } from "intlayer";
213
515
  ```
214
516
 
215
517
  ### React
216
518
 
217
519
  客户端组件:
218
520
 
521
+ ```tsx
522
+ import {
523
+ useNumber,
524
+ useCurrency,
525
+ useDate,
526
+ usePercentage,
527
+ useCompact,
528
+ useList,
529
+ useRelativeTime,
530
+ useUnit,
531
+ } from "react-intlayer/format";
532
+ // 或在 Next.js 应用中
533
+ import {
534
+ useNumber,
535
+ useCurrency,
536
+ useDate,
537
+ usePercentage,
538
+ useCompact,
539
+ useList,
540
+ useRelativeTime,
541
+ useUnit,
542
+ } from "next-intlayer/client/format";
543
+
544
+ const MyComponent = () => {
545
+ const number = useNumber();
546
+ const currency = useCurrency();
547
+ const date = useDate();
548
+ const percentage = usePercentage();
549
+ const compact = useCompact();
550
+ const list = useList();
551
+ const relativeTime = useRelativeTime();
552
+ const unit = useUnit();
553
+
554
+ return (
555
+ <div>
556
+ <p>{number(123456.789)}</p>
557
+ <p>{currency(1234.5, { currency: "EUR" })}</p>
558
+ <p>{date(new Date(), "short")}</p>
559
+ <p>{percentage(0.25)}</p>
560
+ <p>{compact(1200)}</p>
561
+ <p>{list(["apple", "banana", "orange"])}</p>
562
+ <p>{relativeTime(new Date(), new Date() + 1000)}</p>
563
+ <p>{unit(123456.789, { unit: "kilometer" })}</p>
564
+ </div>
565
+ );
566
+ };
567
+ ```
568
+
569
+ 服务器组件(或 React 服务器运行时):
570
+
571
+ ```ts
572
+ import {
573
+ useNumber,
574
+ useCurrency,
575
+ useDate,
576
+ usePercentage,
577
+ useCompact,
578
+ useList,
579
+ useRelativeTime,
580
+ useUnit,
581
+ } from "react-intlayer/server/format";
582
+ // 或在 Next.js 应用中
583
+ import {
584
+ useNumber,
585
+ useCurrency,
586
+ useDate,
587
+ usePercentage,
588
+ useCompact,
589
+ useList,
590
+ useRelativeTime,
591
+ useUnit,
592
+ } from "next-intlayer/server/format";
593
+ ```
594
+
595
+ > 这些钩子将会从 `IntlayerProvider` 或 `IntlayerServerProvider` 中获取语言环境
596
+
597
+ ### Vue
598
+
599
+ 客户端组件:
600
+
219
601
  ```ts
220
- import { useNumber, useCurrency, useDate } from "react-intlayer/format";
221
- // 或者在 Next.js 应用中
222
- import { useNumber, useCurrency, useDate } from "next-intlayer/client/format";
602
+ import {
603
+ useNumber,
604
+ useCurrency,
605
+ useDate,
606
+ usePercentage,
607
+ useCompact,
608
+ useList,
609
+ useRelativeTime,
610
+ useUnit,
611
+ } from "vue-intlayer/format";
223
612
  ```
224
613
 
225
- 服务端组件(或 React 服务器运行时):
614
+ > 这些组合式函数将会使用注入的 `IntlayerProvider` 中的语言环境
615
+
616
+ ## 文档历史
617
+
618
+ | 版本 | 日期 | 变更内容 |
619
+ | ----- | ---------- | ------------------- |
620
+ | 5.8.0 | 2025-08-20 | 添加了 vue 格式化器 |
621
+ | 5.8.0 | 2025-08-18 | 添加了格式化器文档 |
622
+
623
+ 客户端组件:
226
624
 
227
625
  ```ts
228
- import { useNumber, useCurrency, useDate } from "intlayer/server/format";
229
- // 或者在 Next.js 应用中
230
- import { useNumber, useCurrency, useDate } from "next-intlayer/server/format";
626
+ import {
627
+ useNumber,
628
+ useCurrency,
629
+ useDate,
630
+ usePercentage,
631
+ useCompact,
632
+ useList,
633
+ useRelativeTime,
634
+ useUnit,
635
+ } from "vue-intlayer/format";
231
636
  ```
232
637
 
233
- > 这些钩子会考虑来自 `IntlayerProvider` 或 `IntlayerServerProvider` 的 locale
638
+ > 这些组合式函数将会使用注入的 `IntlayerProvider` 中的语言环境
234
639
 
235
640
  ## 文档历史
236
641
 
237
- | 版本 | 日期 | 变更内容 |
238
- | ----- | ---------- | ------------------ |
239
- | 5.8.0 | 2025-08-18 | 添加格式化工具文档 |
642
+ | 版本 | 日期 | 变更内容 |
643
+ | ----- | ---------- | ---------------------------------------------------------------------- |
644
+ | 5.8.0 | 2025-08-20 | 添加列表格式化器文档 |
645
+ | 5.8.0 | 2025-08-20 | 添加额外的 Intl 工具(DisplayNames、Collator、PluralRules) |
646
+ | 5.8.0 | 2025-08-20 | 添加语言环境工具(getLocaleName、getLocaleLang、getLocaleFromPath 等) |
647
+ | 5.8.0 | 2025-08-20 | 添加内容处理工具(getContent、getTranslation、getIntlayer 等) |
@@ -25,8 +25,8 @@ Intlayer 的核心理念是采用每个组件的内容管理。因此,Intlayer
25
25
  .
26
26
  └── Components
27
27
  └── MyComponent
28
- ├── index.content.cjs
29
- └── index.mjs
28
+ ├── index.content.ts
29
+ └── index.tsx
30
30
  ```
31
31
 
32
32
  为此,Intlayer 的作用是找到项目中所有的 `内容声明文件`,无论格式如何,然后从中生成 `字典`。
@@ -45,12 +45,10 @@ Intlayer 的核心理念是采用每个组件的内容管理。因此,Intlayer
45
45
  - 使用应用插件,例如 [`vite-intlayer` 包](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/packages/vite-intlayer/index.md),或其在 [Next.js](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/packages/next-intlayer/index.md) 中的等价插件。当您使用这些插件之一时,Intlayer 会在启动(开发模式)或构建(生产模式)应用时自动构建您的字典。
46
46
 
47
47
  1. 内容文件的声明
48
-
49
48
  - 内容文件可以以多种格式定义,例如 TypeScript、ECMAScript、CommonJS 或 JSON。
50
49
  - 内容文件可以在项目中的任何地方定义,这有助于更好的维护和扩展性。重要的是要遵守内容文件的文件扩展名约定。默认扩展名为 `*.content.{js|cjs|mjs|ts|tsx|json}`,但可以在 [配置文件](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/configuration.md) 中修改。
51
50
 
52
51
  2. `字典` 的生成
53
-
54
52
  - 字典是从内容文件生成的。默认情况下,Intlayer 字典生成在项目的 `.intlayer/dictionaries` 目录中。
55
53
  - 这些字典以不同格式生成,以满足所有需求并优化应用性能。
56
54
 
@@ -198,25 +198,22 @@ const ComponentExample = () => {
198
198
  - 可以使用 VSCode 扩展创建 `.content.{{ts|mjs|cjs|json}}` 文件
199
199
  - IDE 中的自动补全 AI 工具(如 GitHub Copilot)可以帮助你声明内容,减少复制/粘贴
200
200
 
201
- 2. **降低代码库的复杂性**
201
+ 2. **清理代码库**
202
+ - 降低复杂性
203
+ - 提高可维护性
202
204
 
203
- 3. **提高代码库的可维护性**
204
-
205
- 4. **更轻松地复制组件及其相关内容(例如:登录/注册组件等)**
205
+ 3. **更轻松地复制组件及其相关内容(例如:登录/注册组件等)**
206
206
  - 限制影响其他组件内容的风险
207
207
  - 通过复制/粘贴内容从一个应用到另一个应用,无需外部依赖
208
208
 
209
- 5. **避免因未使用的组件而污染代码库,产生未使用的键/值**
210
- - 如果不使用某个组件,则无需导入其内容
209
+ 4. **避免因未使用的组件而污染代码库,产生未使用的键/值**
210
+ - 如果你不使用一个组件,Intlayer 不会导入它的相关内容
211
211
  - 如果你删除一个组件,你会更容易记得删除其相关内容,因为它们会存在于同一个文件夹中
212
212
 
213
- 6. **降低 AI 代理声明多语言内容的推理成本**
213
+ 5. **降低 AI 代理声明多语言内容的推理成本**
214
214
  - AI 代理无需扫描整个代码库来确定内容的实现位置
215
215
  - 翻译可以通过 IDE 中的自动补全 AI 工具(如 GitHub Copilot)轻松完成
216
216
 
217
- 7. **优化加载性能**
218
- - 如果组件是懒加载的,其相关内容也会同时加载
219
-
220
217
  ## Intlayer 的附加功能
221
218
 
222
219
  | 功能 | 描述 |