SetLocale is not working as expected - Instance/Babel problem

Problem

I’m trying to use the function setLocale and It’s not translating the errors. The problem seems to be with the library instance, some babel configuration or import problem.

When I use setLocale and return the same instance of yup to my validation files It does work as expected.

Scenario

Should work like this. Right? index.js

import { setLocale } from 'yup';

setLocale({
  mixed: {
    required: 'Preencha esse campo para continuar'
  },
  string: {
    email: 'Preencha um e-mail válido',
    min: 'Valor muito curto (mínimo ${min} caracteres)',
    max: 'Valor muito longo (máximo ${max} caracteres)'
  },
  number: {
    min: 'Valor inválido (deve ser maior ou igual a ${min})',
    max: 'Valor inválido (deve ser menor ou igual a ${max})'
  }
});

personal-data-validations.js

import * as yup from 'yup';

const PersonalDataSchema = yup.object().shape({
  fullName: yup.string().min(5).max(70).required()
});

export { PersonalDataSchema };

The workaround

I created a index to my validations -> validations.js and export yup from there. After that I imported the yup instance from my validations index and now It’s working.

validations.js

import * as yup from 'yup';

yup.setLocale({
  mixed: {
    required: 'Preencha esse campo para continuar'
  },
  string: {
    email: 'Preencha um e-mail válido',
    min: 'Valor muito curto (mínimo ${min} caracteres)',
    max: 'Valor muito longo (máximo ${max} caracteres)'
  },
  number: {
    min: 'Valor inválido (deve ser maior ou igual a ${min})',
    max: 'Valor inválido (deve ser menor ou igual a ${max})'
  }
});

export default yup;

personal-data-validations.js

import yup from 'validation';

const PersonalDataSchema = yup.object().shape({
  fullName: yup.string().min(5).max(70).required()
});

export { PersonalDataSchema };

[jquense]

you need to set the locale before you import yup elsewhere. schema constructed before you use setLocale will have the old values

[MarcoScabbiolo]

If anyone has this problem using TypeScript you have to define all your schemas as a function that takes yup, for example:

import * as yup from 'yup';

export default (y: typeof yup) =>
  y
    .string()
    .email()
    .max(300);

Pass yup (import * as yup from 'yup') to your schemas after calling setLocale on it.