Как использовать i18n вне setup()?

Question

[Masthead]

Nuxt3.

конфиг i18n -import { AnimeShopLanguage } from '../getLanguage'
import ru from './ru'
import en from './en'

export default defineI18nConfig(() => ({
  locale: ShopLanguage(),
  legacy: false,
  globalInjection: true,
  messages: {
    ru,
    en
  }
}))

Если пытаешься использовать вне - выдает ошибку
runtime-core.esm-bun…r.js?v=05d7a83e:270 Uncaught
SyntaxError: Must be called at the top of a `setup` function

Как использовать i18n вне компонентов?

Comments

[Aetae]

А зачем тебе? Nuxt подразумевает SSR, а чтоб SSR работал без головной боли - надо чтоб всё работало в рамках одного app, чтоб не загрязнять чужой контекст случайно.

[Masthead]

Aetae, для кастомной валидации, к примеру.

import { Message, isValidEmail, isValidPassword } from '~/shared/lib'

export const checkForm = (email: string, password: string): boolean => {
  const { $i18n } = useNuxtApp()
  const t = $i18n.t

  if (!password.trim() || !email.trim()) {
    Message(
      'Username, email, password field cannot be empty!',
      'Имя пользователя, почта и пароль не должны быть пустыми!',
      'warning'
    )
    return false
  }

  if (!isValidEmail(email)) {
    Message('Invalid email format!', 'Неверный формат почты!', 'warning')
    return false
  }
  if (!isValidPassword(password)) {
    Message(
      'Invalid password format! The position must consist of at least 6 characters, 1 letter and 1 number.',
      'Неверный формат пароля! Должно быть минимум 6 знаков, 1 буква и 1 цифра',
      'warning'
    )
    return false
  }

  return true
}

Есть написанная мной message (toast), который прокидывается и через рендер отрисовывает то что надо. Туда, разумеется, нужно прокинуть текст, а сейчас это чисто говнокод, который, к примеру (30+ языков) будет невозможно интегрировать без головной боли)

P.S этот тостик отрисовывается не на сервере, а непосредственно на клиенте. Встраивается в DOM - после отработки автоматически удаляется.

впрочем тут уже и ответ на мой вопрос -

const { $i18n } = useNuxtApp()
  const t = $i18n.t

нашел ответ на гитхабе от акулы по vue/core

[Aetae]

Ну так тут оно всё равно в setup. Просто потом пробрасывается дальше всё ещё в рамках компонента. Не думал что в этом вопрос, т.к. такое решение - суть принцип работы vue и хз как вы раньше без этого жили.:)