Skip to content

Latest commit

ย 

History

History
85 lines (76 loc) ยท 2.3 KB

i18n.md

File metadata and controls

85 lines (76 loc) ยท 2.3 KB

Internationalization

Site Level i18n Config

To leverage multi-language support in VuePress, you first need to use the following file structure:

/
โ”œโ”€ README.md
โ”œโ”€ foo.md
โ”œโ”€ /nested/
โ”‚ย ย โ””โ”€ README.md
โ””โ”€ /zh/
   โ”œโ”€ README.md
   โ”œโ”€ foo.md
   โ””โ”€ /zh/nested/
  ย ย   โ””โ”€ README.md

Then, specify the locales option in .vuepress/config.js:

module.exports = {
  locales: {
    // The key is the path for the locale to be nested under.
    // As a special case, the default locale can use '/' as its path.
    '/': {
      lang: 'en-US', // this will be set as the lang attribute on <html>
      title: 'VuePress',
      description: 'Vue-powered Static Site Generator'
    },
    '/zh/': {
      lang: 'zh-CN',
      title: 'VuePress',
      description: 'Vue ้ฉฑๅŠจ็š„้™ๆ€็ฝ‘็ซ™็”Ÿๆˆๅ™จ'
    }
  }
}

If a locale does not have title or description VuePress will fallback to the root level values. You can omit the root level title and description as long as they are provided in each locale.

Default Theme i18n Config

The default theme also has built-in i18n support via themeConfig.locales, using the same { path: config } format. Each locale can have its own nav and sidebar config, in addition to a few other text values used across the site:

module.exports = {
  locales: { /* ... */ },
  themeConfig: {
    locales: {
      '/': {
        // text for the language dropdown
        selectText: 'Languages',
        // label for this locale in the language dropdown
        label: 'English',
        // text for the edit-on-github link
        editLinkText: 'Edit this page on GitHub',
        // algolia docsearch options for current locale
        algolia: {},
        nav: [
          { text: 'Nested', link: '/nested/' }
        ],
        sidebar: {
          '/': [/* ... */],
          '/nested/': [/* ... */]
        }
      },
      '/zh/': {
        selectText: '้€‰ๆ‹ฉ่ฏญ่จ€',
        label: '็ฎ€ไฝ“ไธญๆ–‡',
        editLinkText: 'ๅœจ GitHub ไธŠ็ผ–่พ‘ๆญค้กต',
        nav: [
          { text: 'ๅตŒๅฅ—', link: '/zh/nested/' }
        ],
        algolia: {},
        sidebar: {
          '/zh/': [/* ... */],
          '/zh/nested/': [/* ... */]
        }
      }
    }
  }
}