国际化支持(internationalization)

网站级别的国际化配置(site level i18n config)

想要在 VuePress 中支持多语言,首先你需要使用如下的文件结构:

docs
├─ README.md
├─ foo.md
├─ nested
│  └─ README.md
└─ zh
   ├─ README.md
   ├─ foo.md
   └─ nested
      └─ README.md

然后,在 .vuepress/config.js 中指定 locales 选项:

module.exports = {
  locales: {
    // 每个语言对象的键(key),是语言的访问路径。
    // 然而,一种特例是将 '/' 作为默认语言的访问路径。
    '/': {
      lang: 'en-US', // 这个值会被设置在 <html> 的 lang 属性上
      title: 'VuePress',
      description: 'Vue-powered Static Site Generator'
    },
    '/zh/': {
      lang: 'zh-CN',
      title: 'VuePress',
      description: 'Vue 驱动的静态网站生成工具'
    }
  }
}

如果某个语言对象没有声明 titledescription,VuePress 会尝试获取根语言对象上相应的值。如果每个语言对象都声明了 titledescription,则可以省略根语言对象上的 titledescription

默认主题的国际化配置(default theme i18n config)

默认主题也内置国际化支持,可以通过 themeConfig.locales 来配置,与上面配置相同,也使用 { path: config } 这种(路径+配置对象)格式。除了可以配置一些整个网站都会用到的文本,每个语言对象都有自己的 导航栏侧边栏

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',
        // config for Service Worker 
        serviceWorker: {
          updatePopup: {
            message: "New content is available.",
            buttonText: "Refresh"
          }
        },
        // algolia docsearch options for current locale
        algolia: {},
        nav: [
          { text: 'Nested', link: '/nested/' }
        ],
        sidebar: {
          '/': [/* ... */],
          '/nested/': [/* ... */]
        }
      },
      '/zh/': {
        // 语言下拉菜单的展示文本
        selectText: '选择语言',
        // 该语言在下拉菜单中的 label 标签
        label: '简体中文',
        // github 编辑链接的文字
        editLinkText: '在 GitHub 上编辑此页',
        serviceWorker: {
          updatePopup: {
            message: "发现新内容可用.",
            buttonText: "刷新"
          }
        },
        nav: [
          { text: '嵌套', link: '/zh/nested/' }
        ],
        algolia: {},
        sidebar: {
          '/zh/': [/* ... */],
          '/zh/nested/': [/* ... */]
        }
      }
    }
  }
}
上次更新: 2018-8-4 04:08:32