I18n

Site I18n Config

To take advantage of multi-language support in VuePress, you first need to use the following file and directory structure:

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

Then, specify the locales option in your config file:

export default {
  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",
      title: "VuePress",
      description: "Vue-powered Static Site Generator",
    },
    "/zh/": {
      lang: "zh-CN",
      title: "VuePress",
      description: "Vue 驱动的静态网站生成器",
    },
  },
};

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

Tips

Config reference: locales

Theme I18n Config

VuePress does not restrict how themes provide multi-language support, so each theme may have different way to handle i18n, and some themes may not provide multi-language support at all. You'd better refer to the theme documentation for detailed guide.

If you are using default theme, the multi-language support is the same as above:

import { defaultTheme } from "vuepress";

export default {
  theme: defaultTheme({
    locales: {
      "/": {
        selectLanguageName: "English",
      },
      "/zh/": {
        selectLanguageName: "简体中文",
      },
    },
  }),
};

Tips

Config reference: Default Theme > locales