I am attempting to integrate vue-i18n from the Vue-i18n Github repository and encountering an error:
vue.js:597 [Vue warn]: Property or method "$t" is not defined
My Vuejs 2 application was functioning properly until I added the initialization code. Can anyone point out where I may have made a mistake? Thank you in advance.
<div id="app">
<p>{{ $t("message.hello")}}</p>
</div>
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>
<script>
const app = new Vue({
el: '#app',
data: {
products: [
'Boots',
]
}
})
</script>
<script>
// Translated locale messages
const messages = {
en: {
message: {
hello: 'hello world'
}
},
ja: {
message: {
hello: 'こんにちは、世界'
}
}
}
// Create VueI18n instance with options
const i18n = new VueI18n({
locale: 'ja', // set locale
messages, // set locale messages
})
// Initialize Vue instance with `i18n` option
new Vue({ i18n }).$mount('#app')
// Application is now running!
</script>