@intlayer/docs 8.10.0 → 8.11.1

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 (167) hide show
  1. package/dist/cjs/common.cjs +3 -1
  2. package/dist/cjs/common.cjs.map +1 -1
  3. package/dist/cjs/generated/docs.entry.cjs +39 -19
  4. package/dist/cjs/generated/docs.entry.cjs.map +1 -1
  5. package/dist/esm/common.mjs +3 -1
  6. package/dist/esm/common.mjs.map +1 -1
  7. package/dist/esm/generated/docs.entry.mjs +39 -19
  8. package/dist/esm/generated/docs.entry.mjs.map +1 -1
  9. package/dist/types/common.d.ts.map +1 -1
  10. package/dist/types/generated/docs.entry.d.ts +2 -1
  11. package/dist/types/generated/docs.entry.d.ts.map +1 -1
  12. package/docs/ar/benchmark/nextjs.md +1 -1
  13. package/docs/ar/benchmark/solid.md +1 -1
  14. package/docs/ar/benchmark/svelte.md +1 -1
  15. package/docs/ar/benchmark/tanstack.md +1 -1
  16. package/docs/ar/dictionary/markdown.md +340 -14
  17. package/docs/ar/interest_of_intlayer.md +1 -1
  18. package/docs/ar/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  19. package/docs/ar/intlayer_with_angular_21.md +412 -0
  20. package/docs/bn/interest_of_intlayer.md +1 -1
  21. package/docs/bn/intlayer_with_angular_21.md +412 -0
  22. package/docs/cs/interest_of_intlayer.md +1 -1
  23. package/docs/cs/intlayer_with_angular_21.md +412 -0
  24. package/docs/de/benchmark/nextjs.md +1 -1
  25. package/docs/de/benchmark/solid.md +1 -1
  26. package/docs/de/benchmark/svelte.md +1 -1
  27. package/docs/de/benchmark/tanstack.md +1 -1
  28. package/docs/de/dictionary/markdown.md +340 -14
  29. package/docs/de/interest_of_intlayer.md +1 -1
  30. package/docs/de/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  31. package/docs/de/intlayer_with_angular_21.md +412 -0
  32. package/docs/en/benchmark/nextjs.md +1 -1
  33. package/docs/en/benchmark/solid.md +1 -1
  34. package/docs/en/benchmark/svelte.md +1 -1
  35. package/docs/en/benchmark/tanstack.md +1 -1
  36. package/docs/en/dictionary/markdown.md +326 -15
  37. package/docs/en/interest_of_intlayer.md +1 -1
  38. package/docs/en/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  39. package/docs/en/intlayer_with_angular_21.md +412 -0
  40. package/docs/en-GB/benchmark/nextjs.md +1 -1
  41. package/docs/en-GB/benchmark/solid.md +1 -1
  42. package/docs/en-GB/benchmark/svelte.md +1 -1
  43. package/docs/en-GB/benchmark/tanstack.md +1 -1
  44. package/docs/en-GB/dictionary/markdown.md +336 -7
  45. package/docs/en-GB/interest_of_intlayer.md +1 -1
  46. package/docs/en-GB/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  47. package/docs/en-GB/intlayer_with_angular_21.md +412 -0
  48. package/docs/es/benchmark/nextjs.md +1 -1
  49. package/docs/es/benchmark/solid.md +1 -1
  50. package/docs/es/benchmark/svelte.md +1 -1
  51. package/docs/es/benchmark/tanstack.md +1 -1
  52. package/docs/es/dictionary/markdown.md +340 -14
  53. package/docs/es/interest_of_intlayer.md +1 -1
  54. package/docs/es/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  55. package/docs/es/intlayer_with_angular_21.md +412 -0
  56. package/docs/fr/benchmark/nextjs.md +1 -1
  57. package/docs/fr/benchmark/solid.md +1 -1
  58. package/docs/fr/benchmark/svelte.md +1 -1
  59. package/docs/fr/benchmark/tanstack.md +1 -1
  60. package/docs/fr/dictionary/markdown.md +340 -14
  61. package/docs/fr/interest_of_intlayer.md +1 -1
  62. package/docs/fr/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  63. package/docs/fr/intlayer_with_angular_21.md +412 -0
  64. package/docs/hi/benchmark/nextjs.md +1 -1
  65. package/docs/hi/benchmark/solid.md +1 -1
  66. package/docs/hi/benchmark/svelte.md +1 -1
  67. package/docs/hi/benchmark/tanstack.md +1 -1
  68. package/docs/hi/dictionary/markdown.md +340 -14
  69. package/docs/hi/interest_of_intlayer.md +1 -1
  70. package/docs/hi/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  71. package/docs/hi/intlayer_with_angular_21.md +412 -0
  72. package/docs/id/benchmark/nextjs.md +1 -1
  73. package/docs/id/benchmark/solid.md +1 -1
  74. package/docs/id/benchmark/svelte.md +1 -1
  75. package/docs/id/benchmark/tanstack.md +1 -1
  76. package/docs/id/dictionary/markdown.md +340 -14
  77. package/docs/id/interest_of_intlayer.md +1 -1
  78. package/docs/id/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  79. package/docs/id/intlayer_with_angular_21.md +412 -0
  80. package/docs/it/benchmark/nextjs.md +1 -1
  81. package/docs/it/benchmark/solid.md +1 -1
  82. package/docs/it/benchmark/svelte.md +1 -1
  83. package/docs/it/benchmark/tanstack.md +1 -1
  84. package/docs/it/dictionary/markdown.md +340 -14
  85. package/docs/it/interest_of_intlayer.md +1 -1
  86. package/docs/it/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  87. package/docs/it/intlayer_with_angular_21.md +412 -0
  88. package/docs/ja/benchmark/nextjs.md +1 -1
  89. package/docs/ja/benchmark/solid.md +1 -1
  90. package/docs/ja/benchmark/svelte.md +1 -1
  91. package/docs/ja/benchmark/tanstack.md +1 -1
  92. package/docs/ja/interest_of_intlayer.md +1 -1
  93. package/docs/ja/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  94. package/docs/ja/intlayer_with_angular_21.md +412 -0
  95. package/docs/ko/benchmark/nextjs.md +1 -1
  96. package/docs/ko/benchmark/solid.md +1 -1
  97. package/docs/ko/benchmark/svelte.md +1 -1
  98. package/docs/ko/benchmark/tanstack.md +1 -1
  99. package/docs/ko/dictionary/markdown.md +340 -14
  100. package/docs/ko/interest_of_intlayer.md +1 -1
  101. package/docs/ko/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  102. package/docs/ko/intlayer_with_angular_21.md +412 -0
  103. package/docs/nl/interest_of_intlayer.md +1 -1
  104. package/docs/nl/intlayer_with_angular_21.md +412 -0
  105. package/docs/pl/benchmark/nextjs.md +1 -1
  106. package/docs/pl/benchmark/solid.md +1 -1
  107. package/docs/pl/benchmark/svelte.md +1 -1
  108. package/docs/pl/benchmark/tanstack.md +1 -1
  109. package/docs/pl/dictionary/markdown.md +340 -14
  110. package/docs/pl/interest_of_intlayer.md +1 -1
  111. package/docs/pl/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  112. package/docs/pl/intlayer_with_angular_21.md +412 -0
  113. package/docs/pt/benchmark/nextjs.md +1 -1
  114. package/docs/pt/benchmark/solid.md +1 -1
  115. package/docs/pt/benchmark/svelte.md +1 -1
  116. package/docs/pt/benchmark/tanstack.md +1 -1
  117. package/docs/pt/dictionary/markdown.md +340 -14
  118. package/docs/pt/interest_of_intlayer.md +1 -1
  119. package/docs/pt/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  120. package/docs/pt/intlayer_with_angular_21.md +412 -0
  121. package/docs/ru/benchmark/nextjs.md +1 -1
  122. package/docs/ru/benchmark/solid.md +1 -1
  123. package/docs/ru/benchmark/svelte.md +1 -1
  124. package/docs/ru/benchmark/tanstack.md +1 -1
  125. package/docs/ru/dictionary/markdown.md +445 -3
  126. package/docs/ru/interest_of_intlayer.md +1 -1
  127. package/docs/ru/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  128. package/docs/ru/intlayer_with_angular_21.md +412 -0
  129. package/docs/tr/benchmark/nextjs.md +1 -1
  130. package/docs/tr/benchmark/solid.md +1 -1
  131. package/docs/tr/benchmark/svelte.md +1 -1
  132. package/docs/tr/benchmark/tanstack.md +1 -1
  133. package/docs/tr/dictionary/markdown.md +340 -14
  134. package/docs/tr/interest_of_intlayer.md +1 -1
  135. package/docs/tr/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  136. package/docs/tr/intlayer_with_angular_21.md +412 -0
  137. package/docs/uk/benchmark/nextjs.md +1 -1
  138. package/docs/uk/benchmark/solid.md +1 -1
  139. package/docs/uk/benchmark/svelte.md +1 -1
  140. package/docs/uk/benchmark/tanstack.md +1 -1
  141. package/docs/uk/dictionary/markdown.md +340 -14
  142. package/docs/uk/interest_of_intlayer.md +1 -1
  143. package/docs/uk/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  144. package/docs/uk/intlayer_with_angular_21.md +412 -0
  145. package/docs/ur/interest_of_intlayer.md +1 -1
  146. package/docs/ur/intlayer_with_angular_21.md +412 -0
  147. package/docs/vi/benchmark/nextjs.md +1 -1
  148. package/docs/vi/benchmark/solid.md +1 -1
  149. package/docs/vi/benchmark/svelte.md +1 -1
  150. package/docs/vi/benchmark/tanstack.md +1 -1
  151. package/docs/vi/dictionary/markdown.md +340 -14
  152. package/docs/vi/interest_of_intlayer.md +1 -1
  153. package/docs/vi/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  154. package/docs/vi/intlayer_with_angular_21.md +412 -0
  155. package/docs/zh/benchmark/nextjs.md +1 -1
  156. package/docs/zh/benchmark/solid.md +1 -1
  157. package/docs/zh/benchmark/svelte.md +1 -1
  158. package/docs/zh/benchmark/tanstack.md +1 -1
  159. package/docs/zh/dictionary/markdown.md +340 -14
  160. package/docs/zh/interest_of_intlayer.md +1 -1
  161. package/docs/zh/{intlayer_with_angular.md → intlayer_with_angular_19.md} +8 -7
  162. package/docs/zh/intlayer_with_angular_21.md +412 -0
  163. package/docs/zh-TW/interest_of_intlayer.md +1 -1
  164. package/docs/zh-TW/intlayer_with_angular_21.md +412 -0
  165. package/package.json +7 -7
  166. package/src/common.ts +12 -6
  167. package/src/generated/docs.entry.ts +39 -19
@@ -0,0 +1,412 @@
1
+ ---
2
+ createdAt: 2025-04-18
3
+ updatedAt: 2026-05-06
4
+ title: Angular i18n - 2026 میں ایک Angular 21 ایپ (Vite) کا ترجمہ کیسے کریں
5
+ description: جانیں کہ اپنی Angular ویب سائٹ کو ملٹی لنگوئل کیسے بنائیں۔ اسے بین الاقوامی بنانے (i18n) اور ترجمہ کرنے کے لیے دستاویزات کی پیروی کریں۔
6
+ keywords:
7
+ - بین الاقوامی بنانا
8
+ - دستاویزات
9
+ - Intlayer
10
+ - Angular
11
+ - JavaScript
12
+ slugs:
13
+ - doc
14
+ - environment
15
+ - angular
16
+ applicationTemplate: https://github.com/aymericzip/intlayer-angular-21-template
17
+ applicationShowcase: https://intlayer-angular-21-template.vercel.app/
18
+ history:
19
+ - version: 8.9.0
20
+ date: 2026-05-04
21
+ changes: "پراپرٹی تک براہ راست رسائی کے لیے Solid useIntlayer API کا استعمال اپ ڈیٹ کر دیا گیا"
22
+ - version: 8.0.0
23
+ date: 2026-01-26
24
+ changes: "مستحکم ورژن جاری کر دیا گیا"
25
+ - version: 8.0.0
26
+ date: 2025-12-30
27
+ changes: "init کمانڈ شامل کر دی گئی"
28
+ - version: 5.5.10
29
+ date: 2025-06-29
30
+ changes: "ابتدائی تاریخ"
31
+ ---
32
+
33
+ # Intlayer کا استعمال کرتے ہوئے اپنی Angular 21 (Vite) ویب سائٹ کا ترجمہ کریں | بین الاقوامی بنانا (i18n)
34
+
35
+ ## فہرست
36
+
37
+ <TOC/>
38
+
39
+ ## Intlayer کیا ہے؟
40
+
41
+ **Intlayer** ایک جدید، اوپن سورس بین الاقوامی (i18n) لائبریری ہے جو جدید ویب ایپس میں ملٹی لنگوئل سپورٹ کو آسان بنانے کے لیے ڈیزائن کی گئی ہے۔
42
+
43
+ Intlayer کے ساتھ، آپ کر سکتے ہیں:
44
+
45
+ - جزو کی سطح پر اعلانیہ لغات کا استعمال کرتے ہوئے **آسانی سے تراجم کا نظم کریں**۔
46
+ - میٹا ڈیٹا، روٹس، اور مواد کو **متحرک طور پر لوکلائز کریں**۔
47
+ - خود کار طریقے سے تیار کردہ اقسام کے ساتھ **TypeScript سپورٹ کو یقینی بنائیں**، جس سے آٹو کمپلیٹ اور غلطی کا پتہ لگانا بہتر ہوتا ہے۔
48
+ - متحرک لوکیل کا پتہ لگانے اور تبدیل کرنے جیسی **جدید خصوصیات سے فائدہ اٹھائیں**۔
49
+
50
+ ---
51
+
52
+ ## Angular ایپلی کیشن میں Intlayer ترتیب دینے کے لیے مرحلہ وار گائیڈ
53
+
54
+ <Tabs defaultTab="code">
55
+ <Tab label="کوڈ" value="code">
56
+
57
+ <iframe
58
+ src="https://ide.intlayer.org/aymericzip/intlayer-angular-21-template?file=intlayer.config.ts"
59
+ className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
60
+ title="Demo CodeSandbox - Intlayer کا استعمال کرتے ہوئے اپنی ایپلی کیشن کو کیسے بین الاقوامی بنائیں"
61
+ sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
62
+ loading="lazy"
63
+ />
64
+
65
+ </Tab>
66
+ <Tab label="ڈیمو" value="demo">
67
+
68
+ <iframe
69
+ src="https://intlayer-angular-21-template.vercel.app/"
70
+ className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
71
+ title="Demo - intlayer-angular-template"
72
+ sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
73
+ loading="lazy"
74
+ />
75
+
76
+ </Tab>
77
+ </Tabs>
78
+
79
+ GitHub پر [ایپلیکیشن ٹیمپلیٹ](https://github.com/aymericzip/intlayer-angular-21-template) دیکھیں۔
80
+
81
+ ### مرحلہ 1: منحصر چیزیں انسٹال کریں
82
+
83
+ npm کا استعمال کرتے ہوئے ضروری پیکجز انسٹال کریں:
84
+
85
+ ```bash packageManager="npm"
86
+ npm install intlayer angular-intlayer
87
+ npm install @angular-builders/custom-esbuild --save-dev
88
+ npx intlayer init
89
+ ```
90
+
91
+ ```bash packageManager="pnpm"
92
+ pnpm add intlayer angular-intlayer
93
+ pnpm add @angular-builders/custom-esbuild --save-dev
94
+ pnpm intlayer init
95
+ ```
96
+
97
+ ```bash packageManager="yarn"
98
+ yarn add intlayer angular-intlayer
99
+ yarn add @angular-builders/custom-esbuild --save-dev
100
+ yarn intlayer init
101
+ ```
102
+
103
+ ```bash packageManager="bun"
104
+ bun add intlayer angular-intlayer
105
+ bun add @angular-builders/custom-esbuild --dev
106
+ bun x intlayer init
107
+ ```
108
+
109
+ - **intlayer**
110
+
111
+ بنیادی پیکج جو کنفیگریشن مینجمنٹ، ترجمہ، [مواد کے اعلان](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/dictionary/content_file.md)، ٹرانسپائلیشن، اور [CLI کمانڈز](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/cli/index.md) کے لیے بین الاقوامی آلات فراہم کرتا ہے۔
112
+
113
+ - **angular-intlayer**
114
+ وہ پیکج جو Intlayer کو Angular ایپلی کیشن کے ساتھ ضم کرتا ہے۔ یہ Angular بین الاقوامی بنانے کے لیے سیاق و سباق فراہم کرنے والے (context providers) اور ہکس فراہم کرتا ہے۔
115
+
116
+ - **@angular-builders/custom-esbuild**
117
+ Angular CLI کی esbuild کنفیگریشن کو حسب ضرورت بنانے کے لیے درکار ہے۔
118
+
119
+ ### مرحلہ 2: آپ کے پروجیکٹ کی کنفیگریشن
120
+
121
+ اپنی ایپ کی زبانوں کو کنفیگر کرنے کے لیے ایک کنفیگریشن فائل بنائیں:
122
+
123
+ ```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
124
+ import { Locales, type IntlayerConfig } from "intlayer";
125
+
126
+ const config: IntlayerConfig = {
127
+ internationalization: {
128
+ locales: [
129
+ Locales.ENGLISH,
130
+ Locales.FRENCH,
131
+ Locales.SPANISH,
132
+ // آپ کی دوسری زبانیں
133
+ ],
134
+ defaultLocale: Locales.ENGLISH,
135
+ },
136
+ };
137
+
138
+ export default config;
139
+ ```
140
+
141
+ > اس کنفیگریشن فائل کے ذریعے، آپ لوکلائزڈ URLs، مڈل ویئر ری ڈائریکشن، کوکی کے نام، اپنے مواد کے اعلانات کا مقام اور توسیع ترتیب دے سکتے ہیں، کنسول میں Intlayer لاگز کو غیر فعال کر سکتے ہیں، اور بہت کچھ کر سکتے ہیں۔ دستیاب پیرامیٹرز کی مکمل فہرست کے لیے، [کنفیگریشن دستاویزات](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/configuration.md) سے رجوع کریں۔
142
+
143
+ ### مرحلہ 3: اپنی Angular کنفیگریشن میں Intlayer کو شامل کریں
144
+
145
+ Intlayer کو Angular CLI کے ساتھ مربوط کرنے کے لیے، آپ کو ایک کسٹم بلڈر استعمال کرنے کی ضرورت ہے۔ یہ گائیڈ فرض کرتی ہے کہ آپ Vite/esbuild (Angular 21 پروجیکٹس کے لیے ڈیفالٹ) استعمال کر رہے ہیں۔
146
+
147
+ پہلے، کسٹم esbuild بلڈر استعمال کرنے کے لیے اپنے `angular.json` میں ترمیم کریں۔ `build` اور `serve` کی کنفیگریشن کو اپ ڈیٹ کریں:
148
+
149
+ ```json5 fileName="angular.json"
150
+ {
151
+ "projects": {
152
+ "your-app-name": {
153
+ "architect": {
154
+ "build": {
155
+ "builder": "@angular-builders/custom-esbuild:application", // replace "@angular/build:application"
156
+ "options": {
157
+ "define": {
158
+ "process.env": "{}",
159
+ },
160
+ "plugins": ["./esbuild.plugins.ts"],
161
+ "browser": "src/main.ts",
162
+ // ...
163
+ },
164
+ },
165
+ "serve": {
166
+ "builder": "@angular-builders/custom-esbuild:dev-server", // replace "@angular/build:dev-server"
167
+ "options": {
168
+ "prebundle": {
169
+ "exclude": [
170
+ "intlayer",
171
+ "angular-intlayer",
172
+ "@intlayer/config/built",
173
+ "@intlayer/core"
174
+ ]
175
+ },
176
+ },
177
+ },
178
+ },
179
+ },
180
+ }
181
+ ```
182
+
183
+ > یقینی بنائیں کہ آپ `angular.json` میں `your-app-name` کو اپنے پروجیکٹ کے اصل نام سے بدل دیں۔
184
+
185
+ اس کے بعد، اپنے پروجیکٹ کے روٹ میں `esbuild.plugins.ts` فائل بنائیں:
186
+
187
+ ```typescript fileName="esbuild.plugins.ts"
188
+ import { intlayerEsbuildPlugin } from "angular-intlayer/esbuild";
189
+
190
+ export default [intlayerEsbuildPlugin()];
191
+ ```
192
+
193
+ > `intlayerEsbuildPlugin` فنکشن esbuild کو Intlayer کے ساتھ کنفیگر کرتا ہے۔ یہ مواد کی تعریفی فائلوں کو سنبھالنے کے لیے پلگ ان داخل کرتا ہے اور بہترین کارکردگی کے لیے ترتیب دیتا ہے۔
194
+
195
+ > **NX صارفین**: NX کے Angular بلڈرز پلگ ان فائلوں کو Node کی مقامی ESM ریزولیوشن کے ذریعے لوڈ کرتے ہیں اور پرواز کے دوران TypeScript پلگ ان فائلوں کو مرتب نہیں کرتے ہیں۔ اس کے بجائے ایک `.mjs` فائل استعمال کریں اور اسی کے مطابق `angular.json` میں `plugins` کا حوالہ اپ ڈیٹ کریں:
196
+ >
197
+ > ```javascript fileName="esbuild.plugins.mjs"
198
+ > import { intlayerEsbuildPlugin } from "angular-intlayer/esbuild";
199
+ >
200
+ > export default [intlayerEsbuildPlugin()];
201
+ > ```
202
+ >
203
+ > پھر `angular.json` میں `"./esbuild.plugins.ts"` کے بجائے `"./esbuild.plugins.mjs"` کی طرف اشارہ کریں۔
204
+
205
+ ### مرحلہ 4: اپنے مواد کا اعلان کریں
206
+
207
+ تراجم کو ذخیرہ کرنے کے لیے اپنے مواد کے اعلانات بنائیں اور ان کا نظم کریں:
208
+
209
+ ```tsx fileName="src/app/app.content.ts" contentDeclarationFormat=["typescript", "esm", "cjs"]
210
+ import { t, type Dictionary } from "intlayer";
211
+
212
+ const appContent = {
213
+ key: "app",
214
+ content: {
215
+ title: t({
216
+ en: "Hello",
217
+ fr: "Bonjour",
218
+ es: "Hola",
219
+ }),
220
+ congratulations: t({
221
+ en: "Congratulations! Your app is running. 🎉",
222
+ fr: "Félicitations! Votre application est en cours d'exécution. 🎉",
223
+ es: "¡Felicidades! Tu aplicación está en ejecución. 🎉",
224
+ }),
225
+ exploreDocs: t({
226
+ en: "Explore the Docs",
227
+ fr: "Explorer les Docs",
228
+ es: "Explorar los Docs",
229
+ }),
230
+ learnWithTutorials: t({
231
+ en: "Learn with Tutorials",
232
+ fr: "Apprendre avec les Tutoriels",
233
+ es: "Aprender con los Tutorios",
234
+ }),
235
+ cliDocs: "CLI Docs",
236
+ angularLanguageService: t({
237
+ en: "Angular Language Service",
238
+ fr: "Service de Langage Angular",
239
+ es: "Servicio de Lenguaje Angular",
240
+ }),
241
+ angularDevTools: "Angular DevTools",
242
+ github: "Github",
243
+ twitter: "Twitter",
244
+ youtube: "Youtube",
245
+ },
246
+ } satisfies Dictionary;
247
+
248
+ export default appContent;
249
+ ```
250
+
251
+ > آپ کے مواد کے اعلانات کو آپ کی ایپلیکیشن میں کہیں بھی متعین کیا جا سکتا ہے جب تک کہ وہ `contentDir` ڈائرکٹری (بطور ڈیفالٹ، `./src`) میں شامل ہوں۔ اور مواد کے اعلان کی فائل ایکسٹینشن سے مماثل ہوں (بطور ڈیفالٹ، `.content.{json,ts,tsx,js,jsx,mjs,cjs}`)۔
252
+
253
+ > مزید تفصیلات کے لیے، [مواد کے اعلان کے دستاویزات](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/dictionary/content_file.md) سے رجوع کریں۔
254
+
255
+ ### مرحلہ 5: اپنے کوڈ میں Intlayer کا استعمال کریں
256
+
257
+ اپنی پوری Angular ایپلی کیشن میں Intlayer کی بین الاقوامی سازی کی خصوصیات کو استعمال کرنے کے لیے، آپ کو ایپ کی کنفیگریشن میں Intlayer فراہم کرنا ہوگا۔
258
+
259
+ ```typescript fileName="src/app/app.config.ts"
260
+ import { ApplicationConfig } from "@angular/core";
261
+ import { provideRouter } from "@angular/router";
262
+ import { provideIntlayer } from "angular-intlayer";
263
+ import { routes } from "./app.routes";
264
+
265
+ export const appConfig: ApplicationConfig = {
266
+ providers: [
267
+ provideRouter(routes),
268
+ provideIntlayer(), // یہاں Intlayer فراہم کنندہ شامل کریں
269
+ ],
270
+ };
271
+ ```
272
+
273
+ پھر، آپ کسی بھی جزو میں `useIntlayer` فنکشن استعمال کر سکتے ہیں۔
274
+
275
+ ```typescript fileName="src/app/app.component.ts"
276
+ import { Component } from "@angular/core";
277
+ import { RouterOutlet } from "@angular/router";
278
+ import { useIntlayer } from "angular-intlayer";
279
+
280
+ @Component({
281
+ selector: "app-root",
282
+ standalone: true,
283
+ imports: [RouterOutlet],
284
+ templateUrl: "./app.component.html",
285
+ styleUrl: "./app.component.css",
286
+ })
287
+ export class AppComponent {
288
+ content = useIntlayer("app");
289
+ }
290
+ ```
291
+
292
+ اور آپ کے ٹیمپلیٹ میں:
293
+
294
+ ```html fileName="src/app/app.component.html"
295
+ <div class="content">
296
+ <h1>{{ content().title }}</h1>
297
+ <p>{{ content().congratulations }}</p>
298
+ </div>
299
+ ```
300
+
301
+ Intlayer مواد ایک `Signal` کے طور پر لوٹایا جاتا ہے، لہذا آپ سگنل کو کال کر کے اقدار تک رسائی حاصل کرتے ہیں: `content().title`۔
302
+
303
+ ### (اختیاری) مرحلہ 6: اپنے مواد کی زبان تبدیل کریں
304
+
305
+ اپنے مواد کی زبان کو تبدیل کرنے کے لیے، آپ `useLocale` فنکشن کے ذریعے فراہم کردہ `setLocale` فنکشن کا استعمال کر سکتے ہیں۔ یہ آپ کو ایپ کا لوکیل سیٹ کرنے اور اسی کے مطابق مواد کو اپ ڈیٹ کرنے کی سہولت دیتا ہے۔
306
+
307
+ زبانوں کے درمیان سوئچ کرنے کے لیے ایک جزو بنائیں:
308
+
309
+ ```typescript fileName="src/app/locale-switcher.component.ts"
310
+ import { Component } from "@angular/core";
311
+ import { CommonModule } from "@angular/common";
312
+ import { useLocale } from "angular-intlayer";
313
+
314
+ @Component({
315
+ selector: "app-locale-switcher",
316
+ standalone: true,
317
+ imports: [CommonModule],
318
+ template: `
319
+ <div class="locale-switcher">
320
+ <select
321
+ [value]="locale()"
322
+ (change)="setLocale($any($event.target).value)"
323
+ >
324
+ @for (loc of availableLocales; track loc) {
325
+ <option [value]="loc">{{ loc }}</option>
326
+ }
327
+ </select>
328
+ </div>
329
+ `,
330
+ })
331
+ export class LocaleSwitcherComponent {
332
+ localeCtx = useLocale();
333
+
334
+ locale = this.localeCtx.locale;
335
+ availableLocales = this.localeCtx.availableLocales;
336
+ setLocale = this.localeCtx.setLocale;
337
+ }
338
+ ```
339
+
340
+ پھر، اس جزو کو اپنے `app.component.ts` میں استعمال کریں:
341
+
342
+ ```typescript fileName="src/app/app.component.ts"
343
+ import { Component } from "@angular/core";
344
+ import { RouterOutlet } from "@angular/router";
345
+ import { useIntlayer } from "angular-intlayer";
346
+ import { LocaleSwitcherComponent } from "./locale-switcher.component";
347
+
348
+ @Component({
349
+ selector: "app-root",
350
+ standalone: true,
351
+ imports: [RouterOutlet, LocaleSwitcherComponent],
352
+ templateUrl: "./app.component.html",
353
+ styleUrl: "./app.component.css",
354
+ })
355
+ export class AppComponent {
356
+ content = useIntlayer("app");
357
+ }
358
+ ```
359
+
360
+ ### TypeScript کو کنفیگر کریں
361
+
362
+ Intlayer TypeScript کے فوائد حاصل کرنے اور آپ کے کوڈ بیس کو مضبوط بنانے کے لیے Module Augmentation کا استعمال کرتا ہے۔
363
+
364
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
365
+
366
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
367
+
368
+ اس بات کو یقینی بنائیں کہ آپ کے TypeScript کنفیگریشن میں خود کار طریقے سے تیار کردہ اقسام (autogenerated types) شامل ہیں۔
369
+
370
+ ```json5 fileName="tsconfig.json"
371
+ {
372
+ // ... آپ کی موجودہ TypeScript کنفیگریشنز
373
+ "include": [
374
+ // ... آپ کی موجودہ TypeScript کنفیگریشنز
375
+ ".intlayer/**/*.ts", // خود کار طریقے سے تیار کردہ اقسام کو شامل کریں
376
+ ],
377
+ }
378
+ ```
379
+
380
+ ### Git کنفیگریشن
381
+
382
+ یہ تجویز کیا جاتا ہے کہ آپ Intlayer کی طرف سے تیار کی گئی فائلوں کو نظر انداز کریں۔ یہ آپ کو انہیں اپنے Git ریپوزٹری میں کمٹ کرنے سے بچاتا ہے۔
383
+
384
+ ایسا کرنے کے لیے، آپ اپنی `.gitignore` فائل میں درج ذیل ہدایات شامل کر سکتے ہیں:
385
+
386
+ ```bash
387
+ # Intlayer کے ذریعہ تیار کردہ فائلوں کو نظر انداز کریں
388
+ .intlayer
389
+ ```
390
+
391
+ ### VS Code ایکسٹینشن
392
+
393
+ Intlayer کے ساتھ اپنے ترقیاتی تجربے کو بہتر بنانے کے لیے، آپ سرکاری **Intlayer VS Code Extension** انسٹال کر سکتے ہیں۔
394
+
395
+ [VS Code Marketplace سے انسٹال کریں](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
396
+
397
+ یہ ایکسٹینشن فراہم کرتا ہے:
398
+
399
+ - ترجمہ کیز (translation keys) کے لیے **آٹو کمپلیشن**۔
400
+ - غائب تراجم کے لیے **ریئل ٹائم ایرر ڈیڈیکشن**۔
401
+ - ترجمہ شدہ مواد کی **ان لائن پریویوز**۔
402
+ - آسانی سے تراجم تخلیق کرنے اور اپ ڈیٹ کرنے کے لیے **تیز اعمال**۔
403
+
404
+ ایکسٹینشن کو استعمال کرنے کے طریقہ کار کے بارے میں مزید تفصیلات کے لیے، [Intlayer VS Code Extension دستاویزات](https://intlayer.org/doc/vs-code-extension) دیکھیں۔
405
+
406
+ ---
407
+
408
+ ### مزید آگے بڑھیں
409
+
410
+ مزید آگے جانے کے لیے، آپ [بصری ایڈیٹر](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/intlayer_visual_editor.md) کو لاگو کر سکتے ہیں یا [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ur/intlayer_CMS.md) کا استعمال کرتے ہوئے اپنے مواد کو آؤٹ سورس کر سکتے ہیں۔
411
+
412
+ ---
@@ -165,7 +165,7 @@ Tôi đã chạy cùng một ứng dụng đa ngôn ngữ trên trình duyệt t
165
165
 
166
166
  Sao GitHub là một chỉ số mạnh mẽ về mức độ phổ biến của dự án, sự tin tưởng của cộng đồng và mức độ phù hợp lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các ngôi sao giúp so sánh sức hút giữa các lựa chọn thay thế và cung cấp thông tin chi tiết về sự phát triển của hệ sinh thái.
167
167
 
168
- [![Star History Chart](https://api.star-history.com/chart?repos=i18next%2Fnext-i18next%2Camannn%2Fnext-intl%2Clingui%2Fjs-lingui%2Cvinissimus%2Fnext-translate%2Cinostudio%2Fnext-international%2Copral%2paraglide-js%2Ctolgee%2Ftolgee-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#i18next/next-i18next&amannn/next-intl&lingui/js-lingui&vinissimus/next-translate&inostudio/next-international&opral/paraglide-js&tolgee/tolgee-js&aymericzip/intlayer)
168
+ [![Star History Chart](https://api.star-history.com/chart?repos=i18next%2Fnext-i18next%2Camannn%2Fnext-intl%2Clingui%2Fjs-lingui%2Cvinissimus%2Fnext-translate%2Cinostudio%2Fnext-international%2Copral%2Fparaglide-js%2Ctolgee%2Ftolgee-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#i18next/next-i18next&amannn/next-intl&lingui/js-lingui&vinissimus/next-translate&inostudio/next-international&opral/paraglide-js&tolgee/tolgee-js&aymericzip/intlayer)
169
169
 
170
170
  ## Kết quả chi tiết
171
171
 
@@ -122,7 +122,7 @@ Chúng tôi đã so sánh **bốn chiến lược tải**:
122
122
 
123
123
  Sao GitHub là một chỉ số mạnh mẽ về mức độ phổ biến của dự án, sự tin tưởng của cộng đồng và mức độ phù hợp lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các ngôi sao giúp so sánh sức hút giữa các lựa chọn thay thế và cung cấp thông tin chi tiết về sự phát triển của hệ sinh thái.
124
124
 
125
- [![Star History Chart](https://api.star-history.com/chart?repos=solidjs-community%2Fsolid-primitives%2Cmbarzda%2Fsolid-i18next%2Copral%2paraglide-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#solidjs-community/solid-primitives&mbarzda/solid-i18next&opral/paraglide-js&aymericzip/intlayer)
125
+ [![Star History Chart](https://api.star-history.com/chart?repos=solidjs-community%2Fsolid-primitives%2Cmbarzda%2Fsolid-i18next%2Copral%2Fparaglide-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#solidjs-community/solid-primitives&mbarzda/solid-i18next&opral/paraglide-js&aymericzip/intlayer)
126
126
 
127
127
  ## Kết quả chi tiết
128
128
 
@@ -120,7 +120,7 @@ Chúng tôi đã so sánh **bốn chiến lược tải**:
120
120
 
121
121
  Sao GitHub là một chỉ số mạnh mẽ về mức độ phổ biến của dự án, sự tin tưởng của cộng đồng và mức độ phù hợp lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các ngôi sao giúp so sánh sức hút giữa các lựa chọn thay thế và cung cấp thông tin chi tiết về sự phát triển của hệ sinh thái.
122
122
 
123
- [![Star History Chart](https://api.star-history.com/chart?repos=kaisermann%2Fsvelte-i18n%2Copral%2paraglide-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#kaisermann/svelte-i18n&opral/paraglide-js&aymericzip/intlayer)
123
+ [![Star History Chart](https://api.star-history.com/chart?repos=kaisermann%2Fsvelte-i18n%2Copral%2Fparaglide-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#kaisermann/svelte-i18n&opral/paraglide-js&aymericzip/intlayer)
124
124
 
125
125
  ## Kết quả chi tiết
126
126
 
@@ -128,7 +128,7 @@ Chúng tôi đã so sánh **bốn chiến lược tải**:
128
128
 
129
129
  Sao GitHub là một chỉ số mạnh mẽ về mức độ phổ biến của dự án, sự tin tưởng của cộng đồng và mức độ phù hợp lâu dài. Mặc dù không phải là thước đo trực tiếp về chất lượng kỹ thuật, chúng phản ánh số lượng nhà phát triển thấy dự án hữu ích, theo dõi tiến trình của nó và có khả năng áp dụng nó. Để ước tính giá trị của một dự án, các ngôi sao giúp so sánh sức hút giữa các lựa chọn thay thế và cung cấp thông tin chi tiết về sự phát triển của hệ sinh thái.
130
130
 
131
- [![Star History Chart](https://api.star-history.com/chart?repos=formatjs%2Fformatjs%2Ci18next%2Freact-i18next%2Clingui%2Fjs-lingui%2Camannn%2Fnext-intl%2Copral%2paraglide-js%2Ctolgee%2Ftolgee-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#formatjs/formatjs&i18next/react-i18next&lingui/js-lingui&amannn/next-intl&opral/paraglide-js&tolgee/tolgee-js&aymericzip/intlayer)
131
+ [![Star History Chart](https://api.star-history.com/chart?repos=formatjs%2Fformatjs%2Ci18next%2Freact-i18next%2Clingui%2Fjs-lingui%2Camannn%2Fnext-intl%2Copral%2Fparaglide-js%2Ctolgee%2Ftolgee-js%2Caymericzip%2Fintlayer&type=date&legend=top-left)](https://www.star-history.com/#formatjs/formatjs&i18next/react-i18next&lingui/js-lingui&amannn/next-intl&opral/paraglide-js&tolgee/tolgee-js&aymericzip/intlayer)
132
132
 
133
133
  ## Kết quả chi tiết
134
134