This version is deprecated and not recommended for production use.
generateI18nLocale and generateI18nSearch functions have now been merged into withI18n. Therefore, both functions will be removed in the next version. Please refer to the documentation to migrate to the withI18n function.This version is deprecated and not recommended for production use.
This version is deprecated and not recommended for production use.
generateI18nLocale and generateI18nSearch functions have now been merged into generateI18n. Therefore, both functions will be removed in the next version. Please refer to the documentation to migrate to the generateI18n function.This version is deprecated and not recommended for production use.
editLinkPattern value even if defined common theme configsdebugPrint option for generateI18nSearchdebugPrint methoddisableAutoSetLangValue methodNot purpose for release. Do not use production.
This version is deprecated and not recommended for production use.
generateI18nLocale and generateI18nSearch functions have now been merged into withI18n. Therefore, both functions will be removed in the next version. Please refer to the documentation to migrate to the withI18n function.This version is deprecated and not recommended for production use.
This version is deprecated and not recommended for production use.
generateI18nLocale and generateI18nSearch functions have now been merged into generateI18n. Therefore, both functions will be removed in the next version. Please refer to the documentation to migrate to the generateI18n function.This version is deprecated and not recommended for production use.
editLinkPattern value even if defined common theme configsdebugPrint option for generateI18nSearchdebugPrint methoddisableAutoSetLangValue methodNot purpose for release. Do not use production.
This page walks you through the installation and use of the VitePress I18n module.
You may need to pre-configure the VitePress module before using this module.
It is recommended that you use Node.js version 18.x or higher. VitePress I18n is written in ESM.
You can install the module using NPM or another node module package manager. This package is only used in the developer environment and should be installed in devDependencies. Install it with the command below:
# via npm
+$ npm i -D vitepress-i18n
+
+# via yarn
+$ yarn add -D vitepress-i18n
+
+# via pnpm
+$ pnpm i -D vitepress-i18nThis article does not cover basic knowledge of VitePress. To learn more about VitePress, please visit: https://vitepress.dev
First, import vitepress-i18n in one of the two ways below.
// \`.vitepress/config.js\`
+import { generateI18n } from 'vitepress-i18n';
+
+const vitePressOptions = {
+ title: 'VitePress',
+ themeConfig: {
+ // ...
+ }
+};
+
+const vitePressI18nOptions = {
+ /* Options... */
+};
+
+export default defineConfig(withI18n(vitePressOptions, vitePressI18nOptions));// \`.vitepress/config.js\`
+import VitePressI18n from 'vitepress-i18n';
+
+const vitePressOptions = {
+ title: 'VitePress',
+ themeConfig: {
+ // ...
+ }
+};
+
+const vitePressI18nOptions = {
+ /* Options... */
+};
+
+export default defineConfig(VitePressI18n.withI18n(vitePressOptions, vitePressI18nOptions));Call withI18n on the defineConfig option of VitePress's configuration file, the .vitepress/config.js file (the name of the configuration file may vary depending on your project environment).
The withI18n must contain two argument values: the first argument contains the value of the option in VitePress and the second argument contains the value of the option in VitePress I18n to override.
The output from VitePress I18n contains automatically translated text. This options data will be merged with the existing options in VitePress.
There are several options available, but they are optional depending on the context. However, the locales option is mandatory: it provides the languages that VitePress I18n should translate into.
withI18n(vitePressOptions, {
+ locales: ['en', 'ko'] // "Required"
+});The value of the locales option must include the supported language codes. For a list of supported language codes, see this article.
VitePress requires you to specify a primary language. This is called the root locale, and in VitePress I18n, you can specify the root locale like this
withI18n(vitePressOptions, {
+ locales: [
+ { path: 'eng', locale: 'en' },
+ { path: 'kor', locale: 'ko' }
+ ],
+ rootLocale: 'en'
+});The value of rootLocale uses a supported language code rather than a directory path. If this option is not specified, the first value in the locales array will be the root locale.
To test what the overall output looks like, try building VitePress with the debugPrint option provided by VitePress I18 set to true. You should see the output in the console.
withI18n(vitePressOptions, {
+ locales: ['en', 'ko'],
+ debugPrint: true
+});To learn more about the options in VitePress I18n, see the VitePress I18n options page.
`,26)]))}const c=i(t,[["render",p]]);export{g as __pageData,c as default}; diff --git a/assets/guide_getting-started.md.Ck0pXdAU.lean.js b/assets/guide_getting-started.md.Ck0pXdAU.lean.js new file mode 100644 index 0000000..fd6a3c3 --- /dev/null +++ b/assets/guide_getting-started.md.Ck0pXdAU.lean.js @@ -0,0 +1,47 @@ +import{_ as i,c as a,a2 as n,o as e}from"./chunks/framework.DPuwY6B9.js";const g=JSON.parse('{"title":"Getting Started","description":"","frontmatter":{"order":1},"headers":[],"relativePath":"guide/getting-started.md","filePath":"en/guide/getting-started.md","lastUpdated":1729749440000}'),t={name:"guide/getting-started.md"};function p(l,s,h,k,r,o){return e(),a("div",null,s[0]||(s[0]=[n(`This page walks you through the installation and use of the VitePress I18n module.
You may need to pre-configure the VitePress module before using this module.
It is recommended that you use Node.js version 18.x or higher. VitePress I18n is written in ESM.
You can install the module using NPM or another node module package manager. This package is only used in the developer environment and should be installed in devDependencies. Install it with the command below:
# via npm
+$ npm i -D vitepress-i18n
+
+# via yarn
+$ yarn add -D vitepress-i18n
+
+# via pnpm
+$ pnpm i -D vitepress-i18nThis article does not cover basic knowledge of VitePress. To learn more about VitePress, please visit: https://vitepress.dev
First, import vitepress-i18n in one of the two ways below.
// \`.vitepress/config.js\`
+import { generateI18n } from 'vitepress-i18n';
+
+const vitePressOptions = {
+ title: 'VitePress',
+ themeConfig: {
+ // ...
+ }
+};
+
+const vitePressI18nOptions = {
+ /* Options... */
+};
+
+export default defineConfig(withI18n(vitePressOptions, vitePressI18nOptions));// \`.vitepress/config.js\`
+import VitePressI18n from 'vitepress-i18n';
+
+const vitePressOptions = {
+ title: 'VitePress',
+ themeConfig: {
+ // ...
+ }
+};
+
+const vitePressI18nOptions = {
+ /* Options... */
+};
+
+export default defineConfig(VitePressI18n.withI18n(vitePressOptions, vitePressI18nOptions));Call withI18n on the defineConfig option of VitePress's configuration file, the .vitepress/config.js file (the name of the configuration file may vary depending on your project environment).
The withI18n must contain two argument values: the first argument contains the value of the option in VitePress and the second argument contains the value of the option in VitePress I18n to override.
The output from VitePress I18n contains automatically translated text. This options data will be merged with the existing options in VitePress.
There are several options available, but they are optional depending on the context. However, the locales option is mandatory: it provides the languages that VitePress I18n should translate into.
withI18n(vitePressOptions, {
+ locales: ['en', 'ko'] // "Required"
+});The value of the locales option must include the supported language codes. For a list of supported language codes, see this article.
VitePress requires you to specify a primary language. This is called the root locale, and in VitePress I18n, you can specify the root locale like this
withI18n(vitePressOptions, {
+ locales: [
+ { path: 'eng', locale: 'en' },
+ { path: 'kor', locale: 'ko' }
+ ],
+ rootLocale: 'en'
+});The value of rootLocale uses a supported language code rather than a directory path. If this option is not specified, the first value in the locales array will be the root locale.
To test what the overall output looks like, try building VitePress with the debugPrint option provided by VitePress I18 set to true. You should see the output in the console.
withI18n(vitePressOptions, {
+ locales: ['en', 'ko'],
+ debugPrint: true
+});To learn more about the options in VitePress I18n, see the VitePress I18n options page.
`,26)]))}const c=i(t,[["render",p]]);export{g as __pageData,c as default}; diff --git a/assets/guide_index.md.CF6anCHw.js b/assets/guide_index.md.CF6anCHw.js new file mode 100644 index 0000000..860667b --- /dev/null +++ b/assets/guide_index.md.CF6anCHw.js @@ -0,0 +1 @@ +import{_ as e,c as t,o as a}from"./chunks/framework.DPuwY6B9.js";const l=JSON.parse('{"title":"Guide","description":"","frontmatter":{"title":"Guide"},"headers":[],"relativePath":"guide/index.md","filePath":"en/guide/index.md","lastUpdated":1729749440000}'),d={name:"guide/index.md"};function i(n,r,o,s,c,p){return a(),t("div")}const m=e(d,[["render",i]]);export{l as __pageData,m as default}; diff --git a/assets/guide_index.md.CF6anCHw.lean.js b/assets/guide_index.md.CF6anCHw.lean.js new file mode 100644 index 0000000..860667b --- /dev/null +++ b/assets/guide_index.md.CF6anCHw.lean.js @@ -0,0 +1 @@ +import{_ as e,c as t,o as a}from"./chunks/framework.DPuwY6B9.js";const l=JSON.parse('{"title":"Guide","description":"","frontmatter":{"title":"Guide"},"headers":[],"relativePath":"guide/index.md","filePath":"en/guide/index.md","lastUpdated":1729749440000}'),d={name:"guide/index.md"};function i(n,r,o,s,c,p){return a(),t("div")}const m=e(d,[["render",i]]);export{l as __pageData,m as default}; diff --git a/assets/guide_options.md.BzUWU8EA.js b/assets/guide_options.md.BzUWU8EA.js new file mode 100644 index 0000000..c5355bf --- /dev/null +++ b/assets/guide_options.md.BzUWU8EA.js @@ -0,0 +1,57 @@ +import{_ as i,c as a,a2 as e,o as n}from"./chunks/framework.DPuwY6B9.js";const c=JSON.parse('{"title":"Options","description":"","frontmatter":{"order":2},"headers":[],"relativePath":"guide/options.md","filePath":"en/guide/options.md","lastUpdated":1730106791000}'),t={name:"guide/options.md"};function l(h,s,p,o,d,k){return n(),a("div",null,s[0]||(s[0]=[e(`This page describes all the options in the VitePress I18n.
locales (Required) string[] | I18nLocale[]Defines a list of languages that this plugin should support. This involves including the language code corresponding to the list of supported languages in an array value.
For example, to support English and Korean, use values like ['en', 'ko'].
withI18n(vitePressOptions, {
+ locales: ['en', 'ko']
+});This way, in your documentation structure, you should organize English as an en directory and Korean as a ko directory.
If you want to name the directories differently than the supported language codes, you can map them with objects of type I18nLocale. For example, if your directories are named eng and kor, you can map them to English and Korean, respectively, as follows
withI18n({
+ locales: [
+ { path: 'eng', locale: 'en' },
+ { path: 'kor', locale: 'ko' }
+ ]
+});Where path is the directory name and locale is the supported language code.
For a list of supported language codes, see this article.
rootLocale stringundefinedThis option value specifies the language code to set as the root locale. In VitePress's i18n settings, that language is specified as root. This value is required to specify the default language for VitePress, but it uses the first array value of the locales option even if you don't specify an option value.
For example, if English is the default language, set the rootLocale value to en.
Note that you must use the locale language code, not the directory path (e.g., use en for the rootLocale value when the directory name is eng).
searchProvider 'local' | 'algolia' | undefinedundefinedSetting this option to local or algolia displays the search interface on your site. The translation of the interface text used for this search is provided automatically. For more information, see the following documentation: https://vitepress.dev/reference/default-theme-search#search
To override VitePress's search options, you can use the searchOptions option.
searchOptions LocalSearchOptions | AlgoliaSearchOptionsundefinedYou can specify refinement options for local or algolia searches.
disableAutoSetLangValue booleanfalseIf this option is true, the lang value is not set automatically.Use this if you do not want to specify a value for the lang attribute of the html tag.
debugPrint booleanfalseIf this option is true, you can try printing the options used and the output to the console log.
label objectundefinedUse this option if you want to use custom labels.
link objectundefinedUse this option if you want to use a custom link.
lang objectundefinedUse this option if you want to use a custom lang property value.
title objectundefinedThis option is used when you want to display different site titles for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ title: {
+ en: 'Welcome',
+ ko: '환영합니다'
+ }
+});titleTemplate objectundefinedThis option is used when you want to display different site title templates (tail separators) for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ titleTemplate: {
+ en: ' | Website',
+ ko: ' | 웹사이트'
+ }
+});description objectundefinedThis option is used when you want to display different site descriptions for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ description: {
+ en: 'Website description',
+ ko: '웹사이트 설명'
+ }
+});head objectundefinedThis option is used when using different head settings for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ head: {
+ en: [['link', { rel: 'icon', href: '/favicon-en.ico' }]],
+ ko: [['link', { rel: 'icon', href: '/favicon-ko.ico' }]]
+ }
+});themeConfig objectundefinedThis option is used when using different themeConfig settings for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ themeConfig: {
+ en: {
+ nav: [
+ {
+ text: 'API',
+ link: '/en/api'
+ }
+ ]
+ },
+ ko: {
+ nav: [
+ {
+ text: 'API',
+ link: '/ko/api'
+ }
+ ]
+ }
+ }
+});This page describes all the options in the VitePress I18n.
locales (Required) string[] | I18nLocale[]Defines a list of languages that this plugin should support. This involves including the language code corresponding to the list of supported languages in an array value.
For example, to support English and Korean, use values like ['en', 'ko'].
withI18n(vitePressOptions, {
+ locales: ['en', 'ko']
+});This way, in your documentation structure, you should organize English as an en directory and Korean as a ko directory.
If you want to name the directories differently than the supported language codes, you can map them with objects of type I18nLocale. For example, if your directories are named eng and kor, you can map them to English and Korean, respectively, as follows
withI18n({
+ locales: [
+ { path: 'eng', locale: 'en' },
+ { path: 'kor', locale: 'ko' }
+ ]
+});Where path is the directory name and locale is the supported language code.
For a list of supported language codes, see this article.
rootLocale stringundefinedThis option value specifies the language code to set as the root locale. In VitePress's i18n settings, that language is specified as root. This value is required to specify the default language for VitePress, but it uses the first array value of the locales option even if you don't specify an option value.
For example, if English is the default language, set the rootLocale value to en.
Note that you must use the locale language code, not the directory path (e.g., use en for the rootLocale value when the directory name is eng).
searchProvider 'local' | 'algolia' | undefinedundefinedSetting this option to local or algolia displays the search interface on your site. The translation of the interface text used for this search is provided automatically. For more information, see the following documentation: https://vitepress.dev/reference/default-theme-search#search
To override VitePress's search options, you can use the searchOptions option.
searchOptions LocalSearchOptions | AlgoliaSearchOptionsundefinedYou can specify refinement options for local or algolia searches.
disableAutoSetLangValue booleanfalseIf this option is true, the lang value is not set automatically.Use this if you do not want to specify a value for the lang attribute of the html tag.
debugPrint booleanfalseIf this option is true, you can try printing the options used and the output to the console log.
label objectundefinedUse this option if you want to use custom labels.
link objectundefinedUse this option if you want to use a custom link.
lang objectundefinedUse this option if you want to use a custom lang property value.
title objectundefinedThis option is used when you want to display different site titles for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ title: {
+ en: 'Welcome',
+ ko: '환영합니다'
+ }
+});titleTemplate objectundefinedThis option is used when you want to display different site title templates (tail separators) for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ titleTemplate: {
+ en: ' | Website',
+ ko: ' | 웹사이트'
+ }
+});description objectundefinedThis option is used when you want to display different site descriptions for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ description: {
+ en: 'Website description',
+ ko: '웹사이트 설명'
+ }
+});head objectundefinedThis option is used when using different head settings for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ head: {
+ en: [['link', { rel: 'icon', href: '/favicon-en.ico' }]],
+ ko: [['link', { rel: 'icon', href: '/favicon-ko.ico' }]]
+ }
+});themeConfig objectundefinedThis option is used when using different themeConfig settings for different languages.
It is declared as an object, with the key value being the language code and the value being string data. You must use the corresponding language code even when you are the root locale. For example, to customize English and Korean respectively, you would set it like this:
withI18n({
+ locales: ['en', 'ko'],
+ rootLocale: 'en',
+ themeConfig: {
+ en: {
+ nav: [
+ {
+ text: 'API',
+ link: '/en/api'
+ }
+ ]
+ },
+ ko: {
+ nav: [
+ {
+ text: 'API',
+ link: '/ko/api'
+ }
+ ]
+ }
+ }
+});This page provides a list of supported languages available for the locales option.
The supported language codes for VitePress I18n are as follows:
| Translation language | Language Code | MT |
|---|---|---|
| English | en | |
| Korean (한국어) | ko | |
| Chinese Simplified (简体中文) | zhHans | |
| Chinese Traditional (繁體中文) | zhHant | O |
| Japanese (日本語) | ja | O |
| Spanish (Español) | es | |
| Portuguese (Português) | pt | |
| Russian (Русский) | ru | |
| Indonesian (Bahasa Indonesia) | id | O |
| German (Deutsch) | de | O |
| French (Français) | fr | O |
| Vietnamese (Tiếng Việt) | vi | O |
| Italian (Italiano) | it | O |
MT (Machine translated) is data using machine translation that has not been reviewed by a local person in the country at this time. However, you can always request translation improvements or new languages via Pull Request!
Translate translates the following locations in VitePress:
This page provides a list of supported languages available for the locales option.
The supported language codes for VitePress I18n are as follows:
| Translation language | Language Code | MT |
|---|---|---|
| English | en | |
| Korean (한국어) | ko | |
| Chinese Simplified (简体中文) | zhHans | |
| Chinese Traditional (繁體中文) | zhHant | O |
| Japanese (日本語) | ja | O |
| Spanish (Español) | es | |
| Portuguese (Português) | pt | |
| Russian (Русский) | ru | |
| Indonesian (Bahasa Indonesia) | id | O |
| German (Deutsch) | de | O |
| French (Français) | fr | O |
| Vietnamese (Tiếng Việt) | vi | O |
| Italian (Italiano) | it | O |
MT (Machine translated) is data using machine translation that has not been reviewed by a local person in the country at this time. However, you can always request translation improvements or new languages via Pull Request!
Translate translates the following locations in VitePress: