Vee-validate: cannot change locale

[schel4ok]

Versions:

VueJs: 2.1.3
Vee-Validate:2.0.0-beta.22

Description:

I use vue integrated in laravel 5.3 and when I try to change locale I got error in console
ReferenceError: Validator is not defined and this brakes all my vue script

Steps To Reproduce:

In my assets\js\bootstrap.js I put this code

window.Vue = require('vue');
require('vue-resource');

import VeeValidate from 'vee-validate';
import messages from '../../../node_modules/vee-validate/dist/locale/ru';
Validator.updateDictionary({
    ru: {
        messages
    }
});
Vue.use(VeeValidate, { locale: 'ru' });

and if I delete this piece of code

Validator.updateDictionary({
    ru: {
        messages
    }
});

then whole vue script is working, but errors in English and I see message in console
[vee-validate]: You are setting the validator locale to a locale that is not defined in the dicitionary. English messages may still be generated.

[schel4ok]

I was able to solve this like that, but it was really luck.
Please update your tutorial, because I was going break my head trying 3 or 4 different solutions from issues and from different part of your tutorial.

import VeeValidate from 'vee-validate';
import messagesRU from '../../../../node_modules/vee-validate/dist/locale/ru';
Vue.use(VeeValidate, {
    locale: 'ru',
    dictionary: { 
        ru: { messages: messagesRU }
    }
});

[logaretm]

Sorry about the inconvenience, the docs are being refactored at the moment, will update it once I finish it.

[core01]

Versions:

"vee-validate": "^2.0.0-rc.19",
"vue": "^2.1.10"

validate.config.js:

export const config = {
  errorBagName: 'errors', // change if property conflicts
  fieldsBagName: 'fields',
  delay: 0,
  locale: 'ru',
  dictionary: null,
  strict: true,
  classes: false,
  classNames: {
    touched: 'touched', // the control has been blurred
    untouched: 'untouched', // the control hasn't been blurred
    valid: 'is-success', // model is valid
    invalid: 'is-danger', // model is invalid
    pristine: 'pristine', // control has not been interacted with
    dirty: 'dirty' // control has been interacted with
  },
  events: 'input|blur',
  inject: true,
  validity: false,
  aria: true
};

app.js:

import Vue from 'vue';
import VeeValidate from 'vee-validate';
import { config } from './validate.config.js';

Vue.use(VeeValidate, config);

const app = new Vue({
  el: '#app',
  components: {

  }
});

Chrome console:

[vee-validate] You are setting the validator locale to a locale that is not defined in the dictionary. English messages may still be generated.

If I add dictionary:

dictionary: { 
        ru: { messages: messagesRU }
    }

warning in Chrome console is disappeared, but error messages still shows on English.

How to change locale?

You can try here: https://jsfiddle.net/logaretm/ffy29utx/3/
Try to replace ru to another locale as en or sv and vee-validate will works fine

[logaretm]

@core01

Your fiddle uses an old version, also doesn't have the RU locale installed.

https://jsfiddle.net/ffy29utx/4/

[core01]

@logaretm Thank you, but in my local project vee-validate does not display russian locale, what am I doing wrong?

[core01]

If I do like this:

import { config } from './validate.config.js';
import VeeValidate, { Validator } from 'vee-validate';
import messagesRU from 'vee-validate/dist/locale/ru';
Validator.addLocale(messagesRU);

Vue.use(VeeValidate, config);

Russian locale works fine, but addLocale method is deprecated.

UPDATE
My falt, works fine as described in doc http://vee-validate.logaretm.com/localization.html#localized-files:

import { config } from './validate.config.js';
import VeeValidate, { Validator } from 'vee-validate';
import ru from 'vee-validate/dist/locale/ru';

Validator.localize('ru', ru);
Vue.use(VeeValidate, config);

[logaretm]

Use localize method instead:

// updates the dictionary and sets the locale to Russian.
Validator.localize('ru', ruLocale);

[alexander-elgin]

The following works for me

import Vue from 'vue'
import VeeValidate, { Validator } from 'vee-validate'
import ruLocale from 'vee-validate/dist/locale/ru'

Validator.localize('ru', ruLocale)
Vue.use(VeeValidate, {
  locale: 'ru'
})

[webcoderkz]

For v3: https://logaretm.github.io/vee-validate/guide/localization.html#using-the-default-i18n