intlify / nuxt3

Nuxt 3 Module for vue-i18n-next
MIT License
202 stars 19 forks source link

[Question] Does this module support route prefixes? #72

Open belegisanin opened 2 years ago

belegisanin commented 2 years ago

Does this module support route prefixes as described here in nuxt/i18n documentation.

None of these strategies work in my nuxt.config.ts

My nuxt.config.ts file.

import { defineNuxtConfig } from "nuxt";

// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
  modules: ["@nuxtjs/prismic", "@intlify/nuxt3", "@nuxtjs/color-mode"],
  prismic: {
    endpoint: "https://studio-022.prismic.io/api/v2",
  },
  intlify: {
    localeDir: "locales",
    strategy: "prefix_except_default",
    vueI18n: {
      defaultLocale: "en",
      locale: "sr-latn",
      fallbackLocale: "en",
    },
  },
});

Does this feature require additional option configuration or is it not supported at all?

SVV-team commented 2 years ago

@belegisanin Nuxt community create i18 branch for Nuxt3 https://github.com/nuxt-community/i18n-module/tree/next

packege.json

"devDependencies": {
    "@nuxtjs/i18n": "npm:@nuxtjs/i18n-edge",
    "nuxt": "^3.0.0-rc.5"
},

Im using it, basic function work properly. Prefix works too)) /en/profile /uk/profile etc

CatalinGheorghiu commented 2 years ago

@belegisanin Nuxt community create i18 branch for Nuxt3 https://github.com/nuxt-community/i18n-module/tree/next

packege.json

"devDependencies": {
    "@nuxtjs/i18n": "npm:@nuxtjs/i18n-edge",
    "nuxt": "^3.0.0-rc.5"
},

Im using it, basic function work properly. Prefix works too)) /en/profile /uk/profile etc

Is RC5 compatible with the i18n-edge? for some reason I am getting an error after upgrading from RC3 to RC5 Screenshot 2022-07-15 at 17 29 34

SVV-team commented 2 years ago

@CatalinGheorghiu

No problem

Снимок экрана 2022-07-18 в 12 00 12 Снимок экрана 2022-07-18 в 12 00 33 Снимок экрана 2022-07-18 в 12 00 56
SVV-team commented 2 years ago

@CatalinGheorghiu Received same trouble after upgrading (yarn upgrade) But yesterday was new commit on community-i18n, with the last one work perfectly in dev and in production versions.

Try now!

Catalin-G commented 2 years ago

@SVV-team works well except one thing. For me, whenever I change the language within language switcher, the translations are empty, but if i refresh the page, they are shown. Have you tried this?

SVV-team commented 2 years ago

@Catalin-G With config in this message - work perfectly I am already have site in production with translations

Switcher

 <NuxtLink v-for="locale in availableLocales"
          :to="switchLocalePath(locale.code)"
          :key="locale.code" class="dropdown-item">{{ locale.name }}
</NuxtLink>

Maybe trouble with your page / component. Must be only one root "div", if no, behavior is unpredictable

senher commented 2 years ago

@CatalinGheorghiu

No problem

Снимок экрана 2022-07-18 в 12 00 12 Снимок экрана 2022-07-18 в 12 00 33 Снимок экрана 2022-07-18 в 12 00 56

Yeah, it's running normally. Thank you

senher commented 2 years ago

@Catalin-G With config in this message - work perfectly I am already have site in production with translations

Switcher

 <NuxtLink v-for="locale in availableLocales"
          :to="switchLocalePath(locale.code)"
          :key="locale.code" class="dropdown-item">{{ locale.name }}
</NuxtLink>

Maybe trouble with your page / component. Must be only one root "div", if no, behavior is unpredictable

Hello, I have a problem. How can I access the $I18N instance in script setup

senher commented 2 years ago

@Catalin-G With config in this message - work perfectly I am already have site in production with translations Switcher

 <NuxtLink v-for="locale in availableLocales"
          :to="switchLocalePath(locale.code)"
          :key="locale.code" class="dropdown-item">{{ locale.name }}
</NuxtLink>

Maybe trouble with your page / component. Must be only one root "div", if no, behavior is unpredictable

Hello, I have a problem. How can I access the $I18N instance in script setup

I found a solution to the problem in the can use const {vueApp} = useNuxtApp(); const i18n = vueApp.i18n;