@aspectus/vue-trans

- `VueTrans` - добавляет во `Vue` метод **_**. Во Vue компонентах используем это так: * В `<template lang='pug>` - ```pug +b.ds-caption.H2 {{ _('Form Title') }} ui-input( :placeholder="_('Your name')" ) ``` * В `<script>` -

Usage no npm install needed!

<script type="module">
  import aspectusVueTrans from 'https://cdn.skypack.dev/@aspectus/vue-trans';
</script>

README

vue-trans

  • VueTrans - добавляет во Vue метод _. Во Vue компонентах используем это так:

    • В <template lang='pug> -
      +b.ds-caption.H2 {{ _('Form Title') }}
  ui-input(
    :placeholder="_('Your name')"
  )
    • В <script> -
      data() {
    return {
      label: this._('Some translatable text')
    }
  }

  • compileMessages - базовые настройки для vue-I18n с указанием локали и подвязкой массива переводов с window.django.catalog. P.S. Не забудь создать глобальную переменную с локалью

  window.language = "!{exp('LANGUAGE_CODE')}"

Установка

yarn add @aspectus/vue-trans

import VueTrans, { compileMessages } from '@aspectus/vue-trans'

Использование

import Vue from 'vue'
import VueI18n from 'vue-i18n'

Vue.use(VueI18n)
Vue.use(VueTrans)

export const i18n = new VueI18n({
  ...compileMessages(),
  silentTranslationWarn: true,
})

И, конечно, не забываем о пакете для бека django-vuejs-translate, без которого это счастье не имеет смысла.

Вот и все) Все переводы появились.