3

In my vue.js 2.5.7 / vuetify": "^1.0.8" application I read i18n support https://vuetifyjs.com/en/framework/internationalization#vue-i18n

and adding lines in my resources/assets/js/app.js :

import en from 'vuetify/src/locale/en' // English
import es from 'vuetify/src/locale/es' // Has no Spain files
import uk from 'vuetify/src/locale/uk' // Ukrainian
Vue.use( Vuetify, {
    lang: {
        locales: {en, es, uk},
        current: 'en'
    }
});

and got error in my console :

ERROR in ./resources/assets/js/app.js
Module not found: Error: Can't resolve 'vuetify/src/locale/en' in '/mnt/_work_sdb8/wwwroot/lar/ArtistsRating/resources/assets/js'

1) Looks like I need to upload some i18n files to my project, but I did not find from where and into which subdir?

2) There si no spain support? It was not in listing in ref above...

Thanks!

  • I think that [this](https://vuetifyjs.com/en/framework/internationalization#create-translation) is more relevant for your case. You need to create a file `es.ts` somewhere in your project and then import it like `import es from './i18n/vuetify/es'`. Actually I'm moving this to an answer. – Ale Sep 21 '18 at 08:16
  • It seems no `es` thus far https://github.com/vuetifyjs/vuetify/blob/dev/src/locale – Traxo Sep 21 '18 at 08:43
  • @Ivan Hi, does it works for you? Because when I follow the documentation, as Ale pointed out in his answer, and do {{ $vuetify.t('my-component.text') }} I don’t get the translated text. How do you display the translated text in your component? Thx – Renaud Tarnec Nov 09 '18 at 06:02

2 Answers2

1

From the documentation

Create a folder in your project like projectName//i18n/vuetify/ and there create a file that with name es.ts. It should look something like this:

export default {
  "dataIterator": {
    "rowsPerPageText": "Items per page:",
    "rowsPerPageAll": "All",
    "pageText": "{0}-{1} of {2}",
    "noResultsText": "No matching records found",
    "nextPage": "Next page",
    "prevPage": "Previous page"
  },
  "dataTable": {
    "rowsPerPageText": "Rows per page:"
  },
  "noDataText": "No data available"
}

Then in your main js file app.js you should have:

import Vuetify from 'vuetify'

// Your own translation file
import es from './i18n/vuetify/es'

Vue.use(Vuetify, {
  lang: {
    locales: { es },
    current: 'es'
  }
})

I haven't tested this but hope it will work.

Ale
  • 944
  • 3
  • 14
  • 34
1

You need only to change vuetify/src/locale/en by vuetify/lib/locale/en and it should works without the need to create any additional file (spain in now supported by vuertify)

Hamdi
  • 361
  • 3
  • 6