Vue.js:597 [vue Warn]: Property Or Method "$t" Is Not Defined

I am trying to implement vue-i18n Vue-i18n Github and I 'have got an error : vue.js:597 [Vue warn]: Property or method '$t' is not defined My vuejs 2 app is working fine until I

Solution 1:

You have to specify i18n in any Vue instance you want vue-i18n to work.

The first instance you have has no i18n specified.

Besides, you have two Vue instances, they don't work together, so what you probably need is just one (with i18n specified).

<divid="app"><p>{{ $t("message.hello")}}</p></div><scriptsrc="https://unpkg.com/vue"></script><scriptsrc="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script><script>// Ready translated locale messagesconst messages = {
    en: {
      message: {
        hello: 'hello world'
      }
    },
    ja: {
      message: {
        hello: 'こんにちは、世界'
      }
    }
  }
  // Create VueI18n instance with optionsconst i18n = newVueI18n({
    locale: 'ja', // set locale
    messages, // set locale messages
  })
  // Create a Vue instance with `i18n` optionconst app = newVue({
    el: '#app',
    i18n, // this is equivalent to `i18n: i18n,` (without quotes, naturally)data: {
      products: [
        'Boots',
      ]
    },
  })
  // Now the app has started!</script>