Internationalization
Support multiple languages in your documentation
Define Config
Fumadocs core provides necessary middleware and options for i18n support.
You can define a config to share between utilities.
import { defineI18n } from 'fumadocs-core/i18n';
export const i18n = defineI18n({
defaultLanguage: 'en',
languages: ['en', 'cn'],
});Hide Locale Prefix
To hide the locale prefix (e.g. /en/page -> /page), use the hideLocale option.
import { defineI18n } from 'fumadocs-core/i18n';
export const i18n = defineI18n({
defaultLanguage: 'en',
languages: ['en', 'cn'],
hideLocale: 'default-locale',
});| Mode | Description |
|---|---|
always | Always hide the prefix, detect locale from cookies |
default-locale | Only hide the default locale |
never | Never hide the prefix (default) |
Using always
On always mode, locale is stored as a cookie (set by the middleware), which isn't optimal for static sites.
This may cause undesired cache problems, and need to pay extra attention on SEO to ensure search engines can index your pages correctly.
Fallback Language
The fallback language to use when translations are missing for a page, default to your defaultLanguage.
Supported:
- A language in your
languagesarray. - When set to
null, no fallback will be used.
import { defineI18n } from 'fumadocs-core/i18n';
export const i18n = defineI18n({
languages: ['en', 'cn'],
defaultLanguage: 'en',
fallbackLanguage: 'cn',
});Middleware
Redirects users to appropriate locale, it can be customised from i18n.ts.
import { createI18nMiddleware } from 'fumadocs-core/i18n/middleware';
import { i18n } from '@/lib/i18n';
export default createI18nMiddleware(i18n);
export const config = {
// Matcher ignoring `/_next/` and `/api/`
// You may need to adjust it to ignore static assets in `/public` folder
matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)'],
};When hideLocale is enabled, it uses NextResponse.rewrite to hide locale prefixes.
How is this guide?
Last updated on