多语言

大约 3 分钟

设置语言重要

你需要为每个语言设置 lang 选项。即使你只在使用单个语言，你也必须在 .vuepress/config.{js,ts} 中设置 lang。

为什么要这样做?

要提供正确的语言环境文本，主题需要知道根文件夹以及每个多语言文件夹正在使用哪种语言。

TS 单语言

import { defineUserConfig } from "vuepress";

export default defineUserConfig({
  // 设置正在使用的语言
  lang: "zh-CN",
});

JS 单语言

export default {
  // 设置正在使用的语言
  lang: "zh-CN",
};

TS 多语言

import { defineUserConfig } from "vuepress";

export default defineUserConfig({
  locales: {
    "/": {
      // 设置正在使用的语言
      lang: "zh-CN",
    },
    "/en/": {
      // 设置正在使用的语言
      lang: "en-US",
    },
  },
});

JS 多语言

export default {
  locales: {
    "/": {
      // 设置正在使用的语言
      lang: "zh-CN",
    },
    "/en/": {
      // 设置正在使用的语言
      lang: "en-US",
    },
  },
};

多语言配置

locales 是一个对象，其键为每个语言的路径前缀，值为该语言的配置，可以包含 title, description, lang 等。

语言适配

简体中文 (zh-CN)
繁体中文 (zh-TW)
英文(美国) (en-US)
德语 (de-DE)
德语(澳大利亚) (de-AT)
俄语 (ru-RU)
乌克兰语 (uk-UA)
越南语 (vi-VN)
葡萄牙语(巴西) (pt-BR)
波兰语 (pl-PL)
法语 (fr-FR)
西班牙语 (es-ES)
斯洛伐克 (sk-SK)
日语 (ja-JP)
土耳其语 (tr-TR)
韩语 (ko-KR)
芬兰语 (fi-FI)
印尼语 (id-ID)
荷兰语 (nl-NL)

注

如果你需要其他语言的多语言支持，你可以为主题和插件设置多语言，这也使你能够自定义内置多语言配置。有关详细信息，请参阅主题 I18n 选项。

也欢迎向此仓库中名为 locale.ts 或 locale 文件夹下的所有文件提交 PR。

为每个语言设置主题选项

与站点配置和 @vuepress/theme-default 的主题配置相同，vuepress-theme-hope 也支持你在主题选项中设置 locale 选项，并为每种语言设置不同的配置。

import { defineUserConfig } from "vuepress";
import { hopeTheme } from "vuepress-theme-hope";

export default defineUserConfig({
  locales: {
    "/": {
      lang: "en-US",
    },
    "/zh/": {
      lang: "zh-CN",
    },
  },

  theme: hopeTheme({
    // 通用配置
    // ...
    locales: {
      "/": {
        // 英文配置
        // ...
      },
      "/zh/": {
        // 中文配置
        // ...
      },
    },
  }),
});

import { hopeTheme } from "vuepress-theme-hope";

export default {
  locales: {
    "/": {
      lang: "en-US",
    },
    "/zh/": {
      lang: "zh-CN",
    },
  },

  theme: hopeTheme({
    // 通用配置
    // ...
    locales: {
      "/": {
        // 英文配置
        // ...
      },
      "/zh/": {
        // 中文配置
        // ...
      },
    },
  }),
};

多语言

设置语言 重要

多语言配置

语言适配

为每个语言设置主题选项

设置语言重要