Skip to content

Quick Start

Install

bash
pnpm add vike-i18n-routing
bash
npm install vike-i18n-routing
bash
yarn add vike-i18n-routing

vike is a peer dependency and should already be installed in the app.

Connect the plugin

Add the config export and define i18n in your Vike app config.

ts
// +config
import vikeVue from 'vike-vue/config'
import vikeI18n from 'vike-i18n-routing/config'
import type { Config } from 'vike/types'
import type { I18nConfig } from 'vike-i18n-routing'

export default {
  extends: [vikeVue, vikeI18n],

  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'ru'],
    prefixDefaultLocale: true,
    routes: {
      '/': { en: '/', ru: '/' },
      '/about': { en: '/about', ru: '/o-nas' },
    },
  } satisfies I18nConfig,
} satisfies Config

Keep file routes canonical

Your app still uses normal Vike page files:

text
pages/
  index/+Page.vue
  about/+Page.vue

There is no separate page file for /o-nas. The public path is localized, the app route is not.

What this setup gives you

Request URLResult
/en/aboutcanonical route is /about
/ru/o-nascanonical route is /about
/aboutredirects to /en/about
/ru/aboutredirects to /ru/o-nas

Next: Base Config