Closed readio closed 1 week ago
Same issue
@readio @LukasGrubis I have the same issue.
I tried downgrading versions and at some point I got another error (../.../vee-validate does not provide an export named 'Field') in the same component I experienced the 'No such validator' issue.
Then I tried to fix that and using this comment: Unable to autoImport components in nuxt and it worked.
Then I installed latest vee-validate (4.14.4) and I see no issue with the validators.
It's kind of a workaround but it's working at the moment.
Im using nuxt 3.13, vue 3.5.12
In order to use vee-validate/rules I created a plugin vee-validate.client.js
containing the following:
import { Form, Field, ErrorMessage, defineRule } from 'vee-validate';
import { required, email, image, max, min, one_of, confirmed, numeric, regex } from '@vee-validate/rules';
export default defineNuxtPlugin((nuxtApp) => {
if (import.meta.client) {
defineRule('required', required);
defineRule('email', email);
defineRule('image', image);
defineRule('max', max);
defineRule('min', min);
defineRule('oneOf', one_of);
defineRule('confirmed', confirmed);
defineRule('numeric', numeric);
defineRule('regex', regex);
}
nuxtApp.vueApp.component('VeeForm', Form);
nuxtApp.vueApp.component('VeeField', Field);
nuxtApp.vueApp.component('VeeErrorMessage', ErrorMessage);
});
In my nuxt.config.ts im not using the veeValidate configurations, and everything is working.
Im using defineComponent setup syntax in some components and other components use <script setup>
syntax
Spent some time on this, I tagged 4.14.5
in attempt to resolve this but it doesn't. I think the main issue is vee-validate is being imported twice, presumably once by the module and once by the plugin.
I'm not sure where to go from here, since vee-validate module looks the same as other modules in the ecosystem.
Seeing this too, have added a custom plugin as a work around
I spent even more time on this. My theory is when vite optimizes vee-validate it splits or copies it in two different chunks. Causing some side-effect reliant logic to break which includes:
My last resort here is to make it so that vee-validate's nuxt module excludes vee-validate from the optimization step which seems to solve both issues. The change is here (41d82fd1f0ceb62f3b9d6b2ca2270dfdc69520fc)
I tagged v4.14.6
just now that works well in the given example, can you guys verify?
@logaretm I can confirm the errors are resolved using the latest version (4.14.6).
Thanks for looking into this and providing a fix.
What happened?
We have just updated to the latest @vee-validate/nuxt, version 4.14.3.
We are now getting an error
Uncaught (in promise) Error: No such validator 'required' exists.
After some investigation it appears that this happens when using the defineComponent setup, instead of
I have included a link to stackblitz to replicate this.
Reproduction steps
No response
Version
Vue.js 3.x and vee-validate 4.x
What browsers are you seeing the problem on?
Relevant log output
No response
Demo link
https://stackblitz.com/edit/nuxt-starter-kgmsew?file=pages%2Findex.vue
Code of Conduct