Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: i18n support #50

Merged
merged 3 commits into from
Jul 21, 2020
Merged

feat: i18n support #50

merged 3 commits into from
Jul 21, 2020

Conversation

antfu
Copy link
Member

@antfu antfu commented Jul 5, 2020

Resolves #41

The only thing left is nav dropdown, that would be another PR.

Working with config: https://github.com/antfu/vitepress-playground/blob/i18n/docs/.vitepress/config.js

/zh/
image

Static build can be handled correctly as well

/index.html

<html lang="en-US">
  <head>
    <title>VitePress Playground | VuePress</title>
    <meta name="description" content="Vue-powered Static Site Generator">
    <link rel="stylesheet" href="/_assets/style.55d0251c.css">

/zh/index.html

<html lang="zh-CN">
  <head>
    <title>VitePress 游乐场 :) | 静态网站生成器</title>
    <meta name="description" content="Vue 驱动的静态网站生成器">
    <link rel="stylesheet" href="/_assets/style.55d0251c.css">

@antfu
Copy link
Member Author

antfu commented Jul 7, 2020

FYI: the $siteByRoute introduced in this PR is a resolved $site that applied i18n data from the locales field based on the current route. (maybe we can I have a better naming of it)

For example, $site like this:

 {
  title: 'VitePress Playground',
  someOtherField: 'foobar',
  locales: {
    '/': {
      lang: 'en-US',
      title: 'VitePress Playground',
      description: 'Vite-powered Static Site Generator'
    },
    '/zh/': {
      lang: 'zh-CN',
      title: 'VitePress 游乐场',
      description: 'Vite 驱动的静态网站生成器'
    }
  }
}

when the route is /zh/guide/example, $siteByRoute will be:

{
  someOtherField: 'foobar',
  lang: 'zh-CN',
  title: 'VitePress 游乐场',
  description: 'Vite 驱动的静态网站生成器'
}

on /getting-started, it will be

{
  someOtherField: 'foobar',
  lang: 'en-US',
  title: 'VitePress Playground',
  description: 'Vite-powered Static Site Generator'
}

The same logic applies to the locales inside themeConfig as well.

By this approach, it only bundles necessary data into the build. And on the theme/component level, the i18n will just work without any extra effort.

Copy link
Member

@kiaking kiaking left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work! Working at my local env too 👍

@yyx990803 yyx990803 merged commit 7802cb5 into vuejs:master Jul 21, 2020
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jan 21, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Multi locale support
3 participants