此页内容

国际化

pengzhanbo

228字小于1分钟

2024-03-05

目录

要使用内置的 i18n (国际化) 功能,需要创建类似于下面的目录结构:

docs/
├─ es/
│  ├─ foo.md
├─ fr/
│  ├─ foo.md
├─ foo.md

vuepress 配置

.vuepress/config.js 中配置:

import { defineUserConfig } from 'vuepress'

export default defineUserConfig({
  // 声明默认的语言
  lang: 'en-US',
  // 多语言下支持的各种语言 locales
  locales: {
    // 配置 不同 path 下的语言
    '/': { lang: 'en-US', title: 'Blog' }, // default
    '/zh/': { lang: 'zh-CN', title: '博客' }, // 简体中文
  }
})

主题配置

在本主题中,同样使用 locales 配置项进行多语言配置。

locales 支持 所有主题配置项。

import { defineUserConfig } from 'vuepress'
import { plumeTheme } from '@vuepress-plume/vuepress-theme-plume'

export default defineUserConfig({
  lang: 'en-US',
  locales: {
    '/': { lang: 'en-US', title: 'Blog' }, // default
    '/zh/': { lang: 'zh-CN', title: '博客' }, // 简体中文
  },
  theme: plumeTheme({
    locales: {
      '/': {
        selectLanguageName: 'English',
        navbar: [
          { text: 'Home', link: '/' },
          { text: 'Blog', link: '/blog/' },
        ]
      },
      '/zh/': {
        selectLanguageName: '简体中文',
        navbar: [
          { text: '首页', link: '/zh/' },
          { text: '博客', link: '/zh/blog/' },
        ]
      }
    }
  })
})