typesafe-i18n demo sveltekit JsDoc

Here is a video for better context. SvelteKit has undergone some major changes since this video was published. For the most up-to-date way of handling i18n, please refer to the code in this repository.

This example demonstrates a typesafe-i18n-integration with SvelteKit with JsDoc comments.

LIVE-DEMO: https://typesafe-i18n-demo-sveltekit-jsdoc.vercel.app

It is a basic example and shows:

• basic i18n setup of three different locales
• auto-detecting user language preferences
• full SSR support
• SEO optimizations
• locale switching
• lazy loading of locales
• persistent locale state via language routes
• typesafety features of typesafe-i18n
• plural rules
• locale specific date-formatting

What is missing:

• opinion how to localize slugs
  this highly depends where your data comes from. This will probably differ from project to project.
• cross-links between your language slugs
  like mentioned above, this will differ from project to project. You can find useful resources here:\
  • rel="alternate" links
  • hreflang attribute
  • SEO optimized examples

add typesafe-i18n to an existing SvelteKit project

If you want to implement the solution in a existing project, you can take a look at the commit history to see a step-by-step guide.

TypeScript version

You can find the exact same example in a TypeScript version here.

learn more

If you want to know more about typesafe-i18n head over to the main repo:

https://github.com/ivanhofer/typesafe-i18n