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

Add internationalization feature #631

Closed
kiaking opened this issue May 19, 2022 · 9 comments · Fixed by #1339
Closed

Add internationalization feature #631

kiaking opened this issue May 19, 2022 · 9 comments · Fixed by #1339
Labels
enhancement New feature or request
Milestone

Comments

@kiaking
Copy link
Member

kiaking commented May 19, 2022

related #628

VitePress Next don't have this feature yet. Let's implement it. While doing so, I would also like to suggest new config structure for locales option.

Currently, we must define two locales when defining multi locale site. One in app config level, and one in theme config level.

I think it's much easier to just be able to define locale on top level only.

export default {
  // Top level config for default and fallbacks.
  lang: 'en',
  title: 'VitePress',
  themeConfig: { ... }
  
  // All other locale settings.
  locales: {
    fr: {
      lang: 'fr',
      title: 'VitePress',
      themeConfig: { ... }
    },

    ja: {
      lang: 'ja',
      title: 'VitePress',
      themeConfig: { ... }
    }
  }
}

This should make typings much simpler too (maybe). It should eliminate weird situation like in #628 🤔

Also, maybe not required for 1.0.0 release, but consider #291 as well.

@kiaking kiaking added the enhancement New feature or request label May 19, 2022
@kiaking kiaking changed the title [next] New localization config structure [next] Add internationalization feature May 24, 2022
@euaaaio
Copy link

euaaaio commented May 24, 2022

Yes, it’s a bit weird. When you create a custom theme with two languages, the localePath of useData() will be broken until you explicitly set themeConfig.locales.

@kiaking kiaking added this to the v1.0.0 milestone May 27, 2022
@kiaking kiaking changed the title [next] Add internationalization feature Add internationalization feature Jun 6, 2022
@xfq
Copy link
Contributor

xfq commented Jun 27, 2022

FWIW, W3C has a Developing Localizable Manifests document (since .vitepress/config.js is also a manifest file).

@brc-dd
Copy link
Member

brc-dd commented Jul 21, 2022

Let's also track #902 and #955 here.

@fvsch
Copy link

fvsch commented Sep 2, 2022

Is the intent for RTL layouts to use CSS logical properties?
I could work on that for the default theme, if that helps.

@trincadev
Copy link

I think this issue is related to #41

@Zhengqbbb
Copy link
Contributor

@brc-dd I'm ready use the test package vitepress@npm:@brc-dd/vitepress@next in my website to support i18n. Thx u great work
And I noticed

Don't override themeConfig.algolia and themeConfig.carbonAds at locale-level.

That I have a question, Have some way to configure algolia search to support i18n
my config: en | zh
preview link: https://deploy-preview-80--cz-git.netlify.app/zh/
You can try search, it disappeared after I clicked it, sure my console should be warn it if it not support.

@brc-dd
Copy link
Member

brc-dd commented Nov 23, 2022

@Zhengqbbb Yeah the Algolia part is not properly implemented yet.

@trincadev Actually this issue is for v1 (alpha, formerly next), and #41 was for v0 (it had i18n support).

@MarkusKeck
Copy link
Collaborator

MarkusKeck commented Dec 22, 2022

@brc-dd @kiaking Is there any update regarding this topic?

At the moment I need to have different .md files for each language, this results in different urls for each language, which can also lead to problems if you want to refer to your page from external sources, cause you already specify the language for the visiting person.

Is it possible to use the default browser locale for this and vitepress decides which language is needed and the .md files load the string from a json file for the current language like every other framework / library does?
The need to have the exact same page multiple times just for translation reasons increases the project files by a huge amount. (2x, 3x, Nx)

Something like this would be neat:

for .md files
[i18n](MY_SPECIFIC_TRANSLATION_LABEL)

for .js / .ts files
t('MY_SPECIFIC_TRANSLATION_LABEL')

Or the vue i18n plugin could be used (the guy who created the plugin also uses vitepress for documentation, maybe he can / wants to integrate it so it could be used natively with vitepress?):

https://vue-i18n.intlify.dev/
https://kazupon.github.io/vue-i18n/introduction.html

Ideally translations could be used in the .md files and .js / .ts files (like the sidebars / navigation bars), so no seperate files just for translation purposes are needed there either.

In my opinion this feature is one of the most important imiprovements on the milestone list for 1.0.0, as almost every vitepress project I have seen uses at least two languages. But I can only speak for myself.

As someone who uses vitepress with multiple languages, I can only say that an easy translation option would have a positive impact on productivity, maintainability and overall project size.

@lmtr0
Copy link

lmtr0 commented Dec 30, 2022

Hi there, whats the implementation status of this issue? is there a branch I can try out with the most advance features?

kiaking pushed a commit that referenced this issue Jan 17, 2023
fix #291
fix #628
fix #631
fix #902
fix #955
fix #1253
fix #1381

Co-authored-by: Hiroki Okada <hirokio@tutanota.com>
Co-authored-by: Sadegh Barati <sadeghbaratiwork@gmail.com>
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jan 25, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants