Use when referencing the vue-i18n plugin for Vue.js
Internationalization plugin for Vue.js.
Questions tagged [vue-i18n]
567 questions
6
votes
3 answers
Vue - Use i18n within the setup script
I need to find a way to use the $t of i18n within the setup script for my vue project
my i18n file looks like this:
import { createI18n } from 'vue-i18n'
import en from './en';
import es from './es';
const messages = { en, es };
const locales = [
…
Tomas Lucena
- 1,204
- 1
- 14
- 31
6
votes
2 answers
How to import multiple locale json files in Vue 3 + i18n?
This is my code, that works without problems:
import { createI18n } from 'vue-i18n'
import messages from './components/json/foo/foo_messages.json'
const app = createApp(App)
installI18n(app)
const i18n = createI18n({
locale: 'ru',
…
Pavel_K
- 10,748
- 13
- 73
- 186
6
votes
3 answers
Vue 3 + ESLint warning [intlify] Detected HTML
Getting a warning inside the console "[intlify] Detected HTML in .....", but can't figure out how to disable this warning for this specific line. I've also tried to change the eslintrc.js file to disable all v-html warnings but didn't work…
KennyDope
- 429
- 1
- 4
- 13
6
votes
2 answers
How can I use vue-i18n in a Vue 3 web component?
I'm creating a Vue web component using vue-cli 4.5.13 and the --target wc option. I also need the component to use the vue-i18n-next plugin (last version for vue 3 projects), which requires some options to be passed to the main Vue instance, but now…
DieSeL
- 131
- 2
- 8
6
votes
3 answers
Vue 3 + vue-i18n-next: what am I doing wrong?
I've started a Vue 3 project (currently not much more than a boilerplate with TypeScript) and tried to add i18n to it.
As far as I've got, vue-i18n does not work properly with Vue 3; but vue-i18n-next should.
here is my main.ts
import { createApp }…
Alex Povolotsky
- 381
- 2
- 4
- 10
6
votes
1 answer
vue-i18n this.$tc is not a function
My lang file:
AccountNotifications: {
createdWithName: 'Account «{account}» created',
created: 'Account created | Accounts created',
}
my submit method
submit()
this.$notifications.add({
type: 'success',
html:…
Vue-i18n-question
- 61
- 1
- 3
6
votes
1 answer
vue add i18n runs into error with vuejs3 and @vue/cli 4.5.4, what does the error mean and how to debug?
when I try to vue add i18n I am running in this error:
Invoking generator for vue-cli-plugin-i18n...
ERROR Error: You cannot call "get" on a collection with no paths. Instead, check the "length" property first to verify at least 1 path…
helle
- 11,183
- 9
- 56
- 83
6
votes
2 answers
How to use multiple files per language with vue-i18n in vue?
I am new to vue and I am using vuetify. I want to add internationalization to my project. I succeeded in that but I am using the standard method in which we make a single file per language, as my project grows it will be very hard to maintain that…
Nikhil
- 175
- 2
- 10
6
votes
1 answer
Error in Vue i18n with TypeScript: "Property '$t' does not exist on type 'VueConstructor'. " . How can I fix it?
In project some common function are in separate .ts files.
How can I use i18 in that cases:
// for i18n
import Vue from 'vue'
declare module 'vue/types/vue' {
interface VueConstructor {
$t: any
}
}
declare module 'vue/types/options' {
…
Skif
- 1,178
- 4
- 14
- 26
6
votes
2 answers
Vue-Router language based route prefix
I'm using prerender-spa-plugin in order to prerender certain pages so I get better SEO from my Vue app.
My goal is to transform the way I'm currently using Vue-i18n, so I can base it on url param /lang. Examples: /en/home or /nl/home. With this, I…
Jesús Fuentes
- 919
- 2
- 11
- 33
6
votes
4 answers
How to use vue-i18n translate function in script part of component
I'm using laravel-vue-i18n-generator package to handle text translation in vuejs component in my laravel project. I've set up app.js like below:
import VueInternationalization from 'vue-i18n';
import Locale from…
pemi
- 177
- 1
- 1
- 5
6
votes
2 answers
How to use vue-i18n with Vue class components?
The following code:
import Vue from 'vue'
import Component from 'vue-class-component'
@Component
export default class SomeComponent extends Vue {
public someText = this.$t('some.key')
}
Throws an error:
[Vue warn]: Error in data(): "TypeError:…
Kyll
- 7,036
- 7
- 41
- 64
6
votes
1 answer
Lazy loading translation file in tag
I want to reduce my app size and i started from language files.
I'm using vue-i18n Single File Components and i can lazy load like this vue-i18n Lazy loading. I read about custom lang blocks, but as i know i can't set dynamic locale in src.
Now my…
hafer
- 137
- 1
- 10
6
votes
1 answer
How can I display currency with decimal and without it in vue-i18n
With the following configuration I can output an amount with a currency
const numberFormats = {
"en-GB": {
currency: {
style: 'currency', currency: 'GBP'
}
},
"en-US": {
currency: {
style:…
Matteo Gilardoni
- 311
- 3
- 15
5
votes
1 answer
vue3+vite+vuei18n build "Uncaught TypeError: _ctx.$t is not a function"
I want to publish my vue3+vite package to npm but after publishing, I encountered "Uncaught TypeError: _ctx.$t is not a function" in a test project and my package is not working, any suggestions... ?
PS: I'm using vue options…
Alireza Safari
- 166
- 2
- 11