Skip to content

Commit bccddbf

Browse files
committed
feat: adjust i18n config + documentation
1 parent f0a1a00 commit bccddbf

File tree

13 files changed

+260
-72
lines changed

13 files changed

+260
-72
lines changed

docs/.vuepress/config.js

+43-38
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,11 @@ module.exports = {
33
locales: {
44
'/': {
55
lang: 'en-US',
6-
label: 'English',
7-
selectText: 'Languages',
86
title: 'VuePress',
97
description: 'Vue-powered Static Site Generator'
108
},
119
'/zh/': {
1210
lang: 'zh-CN',
13-
label: '简体中文',
14-
selectText: '选择语言',
1511
title: 'VuePress',
1612
description: 'Vue 驱动的静态网站生成器'
1713
}
@@ -32,42 +28,51 @@ module.exports = {
3228
repo: 'vuejs/vuepress',
3329
editLinks: true,
3430
docsDir: 'docs',
35-
nav: {
36-
'/': [
37-
{
38-
text: 'Guide',
39-
link: '/guide/',
40-
},
41-
{
42-
text: 'Config Reference',
43-
link: '/config/'
44-
},
45-
{
46-
text: 'Default Theme Config',
47-
link: '/default-theme-config/'
31+
locales: {
32+
'/': {
33+
label: 'English',
34+
selectText: 'Languages',
35+
editLinkText: 'Edit this page on GitHub',
36+
nav: [
37+
{
38+
text: 'Guide',
39+
link: '/guide/',
40+
},
41+
{
42+
text: 'Config Reference',
43+
link: '/config/'
44+
},
45+
{
46+
text: 'Default Theme Config',
47+
link: '/default-theme-config/'
48+
}
49+
],
50+
sidebar: {
51+
'/guide/': genSidebarConfig('Guide')
4852
}
49-
],
50-
'/zh/': [
51-
{
52-
text: '指南',
53-
link: '/zh/guide/',
54-
},
55-
{
56-
text: '配置',
57-
link: '/zh/config/'
58-
},
59-
{
60-
text: '默认主题',
61-
link: '/zh/default-theme-config/'
53+
},
54+
'/zh/': {
55+
label: '简体中文',
56+
selectText: '选择语言',
57+
editLinkText: '在 GitHub 上编辑此页',
58+
nav: [
59+
{
60+
text: '指南',
61+
link: '/zh/guide/',
62+
},
63+
{
64+
text: '配置',
65+
link: '/zh/config/'
66+
},
67+
{
68+
text: '默认主题',
69+
link: '/zh/default-theme-config/'
70+
}
71+
],
72+
sidebar: {
73+
'/zh/guide/': genSidebarConfig('指南')
6274
}
63-
]
64-
},
65-
sidebar: {
66-
'/guide/': genSidebarConfig('Guide'),
67-
'/zh/guide/': genSidebarConfig('指南')
68-
},
69-
editLinkText: {
70-
'/zh/': '在 GitHub 上编辑此页'
75+
}
7176
}
7277
}
7378
}

docs/config/README.md

+7
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,13 @@ The `serviceWorker` option only handles the service worker. To make your site fu
9898
Also, only enable this if you are able to deploy your site with SSL, since service worker can only be registered under HTTPs URLs.
9999
:::
100100

101+
### locales
102+
103+
- Type: `{ [path: string]: Object }`
104+
- Default: `undefined`
105+
106+
Specify locales for i18n support. For more details, see the guide on [Internationalization](../guide/i18n.md).
107+
101108
## Theming
102109

103110
### theme

docs/default-theme-config/README.md

+3-1
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,9 @@ module.exports = {
231231
// optional, defaults to master
232232
docsBranch: 'master',
233233
// defaults to true, set to false to disable
234-
editLinks: true
234+
editLinks: true,
235+
// custom text for edit link. Defaults to "Edit this page"
236+
editLinkText: 'Help us improve this page!'
235237
}
236238
}
237239
```

docs/guide/i18n.md

+82
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
# Internationalization
2+
3+
## Site Level i18n Config
4+
5+
To leverage multi-language support in VuePress, you first need to use the following file structure:
6+
7+
```
8+
/
9+
├─ README.md
10+
├─ foo.md
11+
├─ /nested/
12+
│  └─ README.md
13+
└─ /zh/
14+
├─ README.md
15+
├─ foo.md
16+
└─ /zh/nested/
17+
   └─ README.md
18+
```
19+
20+
Then, specify the `locales` option in `.vuepress/config.js`:
21+
22+
``` js
23+
module.exports = {
24+
locales: {
25+
// The key is the path for the locale to be nested under.
26+
// As a special case, the default locale can use '/' as its path.
27+
'/': {
28+
lang: 'en-US', // this will be set as the lang attribute on <html>
29+
title: 'VuePress',
30+
description: 'Vue-powered Static Site Generator'
31+
},
32+
'/zh/': {
33+
lang: 'zh-CN',
34+
title: 'VuePress',
35+
description: 'Vue 驱动的静态网站生成器'
36+
}
37+
}
38+
}
39+
```
40+
41+
If a locale does not have `title` or `description` VuePress will fallback to the root level values. You can omit the root level `title` and `description` as long as they are provided in each locale.
42+
43+
## Default Theme i18n Config
44+
45+
The default theme also has built-in i18n support via `themeConfig.locales`, using the same `{ path: config }` format. Each locale can have its own [nav](../default-theme-config/#navbar-links) and [sidebar](../default-theme-config/#sidebar) config, in addition to a few other text values used across the site:
46+
47+
``` js
48+
module.exports = {
49+
locales: { /* ... */ },
50+
themeConfig: {
51+
locales: {
52+
'/': {
53+
// text for the language dropdown
54+
selectText: 'Languages',
55+
// label for this locale in the language dropdown
56+
label: 'English',
57+
// text for the edit-on-github link
58+
editLinkText: 'Edit this page on GitHub',
59+
nav: [
60+
{ text: 'Nested', link: '/nested/' }
61+
],
62+
sidebar: {
63+
'/': [/* ... */],
64+
'/nested/': [/* ... */]
65+
}
66+
},
67+
'/zh/': {
68+
selectText: '选择语言',
69+
label: '简体中文',
70+
editLinkText: '在 GitHub 上编辑此页',
71+
nav: [
72+
{ text: '嵌套', link: '/zh/nested/' }
73+
],
74+
sidebar: {
75+
'/zh/': [/* ... */],
76+
'/zh/nested/': [/* ... */]
77+
}
78+
}
79+
}
80+
}
81+
}
82+
```

docs/zh/config/README.md

+7
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,13 @@ module.exports = {
9797
当然,仅仅只在你的网站部署后能用 SSL 的时候开启它,因为 service worker 只能在 HTTPs 的链接下注册。
9898
:::
9999

100+
### locales
101+
102+
- 类型: `{ [path: string]: Object }`
103+
- 默认值: `undefined`
104+
105+
提供多语言支持的语言配置。具体细节请查看 [多语言支持](../guide/i18n.md)
106+
100107
## 主题
101108

102109
### theme

docs/zh/default-theme-config/README.md

+5-3
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ sidebar: auto
44

55
# 默认主题
66

7-
::: tip
8-
所有列在这一页的选项仅对默认的主题生效。如果你在使用一个自定义主题,选项可能会有不同。
7+
::: tip 提示
8+
本页所列的选项仅对默认主题生效。如果你在使用一个自定义主题,选项可能会有不同。
99
:::
1010

1111
## 首页
@@ -226,7 +226,9 @@ module.exports = {
226226
// 可选的, 默认是 master
227227
docsBranch: 'master',
228228
// 默认是 true, 设置为 false 来禁用
229-
editLinks: true
229+
editLinks: true,
230+
// 默认为 "Edit this page"
231+
editLinkText: '帮助我们改善此页面!'
230232
}
231233
}
232234
```

docs/zh/guide/assets.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
![Image from dependency](~some-dependency/image.png)
1818
```
1919

20-
Webpack 的别名可以通过 `.vuepress/config.js`[configureWebpack](/zh/config/#configurewebpack) 来配置,如:
20+
Webpack 的别名可以通过 `.vuepress/config.js`[configureWebpack](../config/#configurewebpack) 来配置,如:
2121

2222
``` js
2323
module.exports = {

docs/zh/guide/i18n.md

+82
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
# 多语言支持
2+
3+
## 站点多语言配置
4+
5+
要启用 VuePress 的多语言支持,首先需要使用如下的文件结构:
6+
7+
```
8+
/
9+
├─ README.md
10+
├─ foo.md
11+
├─ /nested/
12+
│  └─ README.md
13+
└─ /zh/
14+
├─ README.md
15+
├─ foo.md
16+
└─ /zh/nested/
17+
   └─ README.md
18+
```
19+
20+
然后,在 `.vuepress/config.js` 中提供 `locales` 选项:
21+
22+
``` js
23+
module.exports = {
24+
locales: {
25+
// 键名是该语言所属的子路径
26+
// 作为特例,默认语言可以使用 '/' 作为其路径。
27+
'/': {
28+
lang: 'en-US', // 将会被设置为 <html> 的 lang 属性
29+
title: 'VuePress',
30+
description: 'Vue-powered Static Site Generator'
31+
},
32+
'/zh/': {
33+
lang: 'zh-CN',
34+
title: 'VuePress',
35+
description: 'Vue 驱动的静态网站生成器'
36+
}
37+
}
38+
}
39+
```
40+
41+
如果一个语言没有声明 `title` 或者 `description`,VuePress 将会尝试使用配置顶层的对应值。如果每个语言都声明了 `title``description`,则顶层的这两个值可以被省略。
42+
43+
## 默认主题多语言配置
44+
45+
默认主题也内置了多语言支持,可以通过 `themeConfig.locales` 来配置。该选项接受同样的 `{ path: config }` 格式的值。每个语言除了可以配置一些站点中用到的文字之外,还可以拥有自己的 [导航栏](../default-theme-config/#导航栏)[侧边栏](../default-theme-config/#侧边栏) 配置:
46+
47+
``` js
48+
module.exports = {
49+
locales: { /* ... */ },
50+
themeConfig: {
51+
locales: {
52+
'/': {
53+
selectText: 'Languages',
54+
label: 'English',
55+
editLinkText: 'Edit this page on GitHub',
56+
nav: [
57+
{ text: 'Nested', link: '/nested/' }
58+
],
59+
sidebar: {
60+
'/': [/* ... */],
61+
'/nested/': [/* ... */]
62+
}
63+
},
64+
'/zh/': {
65+
// 多语言下拉菜单的标题
66+
selectText: '选择语言',
67+
// 该语言在下拉菜单中的标签
68+
label: '简体中文',
69+
// 编辑链接文字
70+
editLinkText: '在 GitHub 上编辑此页',
71+
nav: [
72+
{ text: '嵌套', link: '/zh/nested/' }
73+
],
74+
sidebar: {
75+
'/zh/': [/* ... */],
76+
'/zh/nested/': [/* ... */]
77+
}
78+
}
79+
}
80+
}
81+
}
82+
```

lib/app/dataMixin.js

+3
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,9 @@ export default {
5858
$localePath () {
5959
return this.$localeConfig.path || '/'
6060
},
61+
$themeLocaleConfig () {
62+
return (this.$site.themeConfig.locales || {})[this.$localePath] || {}
63+
},
6164
$page () {
6265
return findPageForPath(
6366
this.$site.pages,

lib/default-theme/Layout.vue

+4-5
Original file line numberDiff line numberDiff line change
@@ -48,17 +48,16 @@ export default {
4848
return (
4949
!frontmatter.layout &&
5050
!frontmatter.home &&
51-
frontmatter.sidebar !== false && (
52-
frontmatter.sidebar === 'auto' ||
53-
themeConfig.sidebar
54-
)
51+
frontmatter.sidebar !== false &&
52+
this.sidebarItems.length
5553
)
5654
},
5755
sidebarItems () {
5856
return resolveSidebarItems(
5957
this.$page,
6058
this.$route,
61-
this.$site
59+
this.$site,
60+
this.$localePath
6261
)
6362
},
6463
pageClasses() {

lib/default-theme/NavLinks.vue

+4-6
Original file line numberDiff line numberDiff line change
@@ -30,21 +30,19 @@ export default {
3030
components: { OutboundLink, NavLink, DropdownLink },
3131
computed: {
3232
userNav () {
33-
const { nav } = this.$site.themeConfig
34-
if (Array.isArray(nav)) return nav
35-
if (typeof nav === 'object') return nav[this.$localePath]
36-
return []
33+
return this.$themeLocaleConfig.nav || this.$site.themeConfig.nav || []
3734
},
3835
nav () {
3936
const { locales } = this.$site
4037
if (locales) {
4138
let currentLink = this.$page.path
4239
const routes = this.$router.options.routes
40+
const themeLocales = this.$site.themeConfig.locales || {}
4341
const languageDropdown = {
44-
text: this.$localeConfig.selectText,
42+
text: this.$themeLocaleConfig.selectText || 'Languages',
4543
items: Object.keys(locales).map(path => {
4644
const locale = locales[path]
47-
const text = locale.label
45+
const text = themeLocales[path] && themeLocales[path].label || locale.lang
4846
let link
4947
// Stay on the current page
5048
if (locale.lang === this.$lang) {

0 commit comments

Comments
 (0)