You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/advanced-features/i18n-routing.md
+26-17Lines changed: 26 additions & 17 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -234,6 +234,30 @@ Next.js doesn't know about variants of a page so it's up to you to add the `href
234
234
235
235
> Note that Internationalized Routing does not integrate with [`next export`](/docs/advanced-features/static-html-export.md) as `next export` does not leverage the Next.js routing layer. Hybrid Next.js applications that do not use `next export` are fully supported.
236
236
237
+
### Dynamic getStaticProps Pages
238
+
239
+
For dynamic `getStaticProps` pages, any locale variants of the page that is desired to be prerendered needs to be returned from [`getStaticPaths`](/docs/basic-features/data-fetching.md#getstaticpaths-static-generation). Along with the `params` object that can be returned for the `paths`, you can also return a `locale` field specifying which locale you want to render. For example:
240
+
241
+
```js
242
+
// pages/blog/[slug].js
243
+
exportconstgetStaticPaths= ({ locales }) => {
244
+
return {
245
+
paths: [
246
+
// if no `locale` is provided only the defaultLocale will be generated
247
+
{ params: { slug:'post-1' }, locale:'en-US' },
248
+
{ params: { slug:'post-1' }, locale:'fr' },
249
+
],
250
+
fallback:true,
251
+
}
252
+
}
253
+
```
254
+
255
+
For automatically statically optimized and non-dynamic `getStaticProps` pages a version of the page will be generated for each locale. This is important to consider since it can increase build times depending on how many locales are configured and what data fetching is being done inside of `getStaticProps`.
256
+
257
+
If you have 50 locales configured with 10 non-dynamic pages with `getStaticProps` this means `getStaticProps` will be called 500 times and 50 version of these 10 pages will be generated during each build.
258
+
259
+
To improve the performance of generating these pages during build time dynamic pages with `getStaticProps` and [a `fallback` mode](https://nextjs.org/docs/basic-features/data-fetching#fallback-true) can be leveraged instead. This allows you to return only the most popular paths and locales from `getStaticPaths` to prerender during the build and then lazily build the rest during runtime when they are requested.
260
+
237
261
### Automatically Statically Optimized Pages
238
262
239
263
For pages that are [automatically statically optimized](/docs/advanced-features/automatic-static-optimization.md), a version of the page will be generated for each locale.
For dynamic `getStaticProps` pages, any locale variants of the page that is desired to be prerendered needs to be returned from [`getStaticPaths`](/docs/basic-features/data-fetching.md#getstaticpaths-static-generation). Along with the `params` object that can be returned for the `paths`, you can also return a `locale` field specifying which locale you want to render. For example:
271
-
272
-
```js
273
-
// pages/blog/[slug].js
274
-
exportconstgetStaticPaths= ({ locales }) => {
275
-
return {
276
-
paths: [
277
-
{ params: { slug:'post-1' }, locale:'en-US' },
278
-
{ params: { slug:'post-1' }, locale:'fr' },
279
-
],
280
-
fallback:true,
281
-
}
282
-
}
283
-
```
284
-
285
292
## Limits for the i18n config
286
293
287
294
-`locales`: 100 total locales
288
295
-`domains`: 100 total locale domain items
296
+
297
+
> These limits are initial to provide a upper bound on how many locales should be configured to prevent performance impacts, we will re-visit these if they appear to be too low for valid use cases.
Copy file name to clipboardExpand all lines: packages/next/server/config.ts
+2-2Lines changed: 2 additions & 2 deletions
Original file line number
Diff line number
Diff line change
@@ -329,8 +329,8 @@ function assignDefaults(userConfig: { [key: string]: any }) {
329
329
}
330
330
331
331
if(i18n.locales.length>100){
332
-
thrownewError(
333
-
`Received ${i18n.locales.length} i18n.locales items which exceeds the max of 100, please reduce the number of items to continue.\nSee more info here: https://nextjs.org/docs/messages/invalid-i18n-config`
332
+
console.warn(
333
+
`Received ${i18n.locales.length} i18n.locales items which exceeds the recommended max of 100.\nSee more info here: https://nextjs.org/docs/advanced-features/i18n-routing#how-does-this-work-with-static-generation`
0 commit comments