When I add:
Vue.use(VeeValidate);
My Vue page shows up blank with the console error:
TypeError: plugin is undefined
I found the following with the same error:
Vue plugin vee-validate not installing properly
but I am not utilizing the => syntax anywhere in my .vue document.
vee-validate 3.0.3, Vue 2.6.10
Full main.js file:
import Vue from 'vue'
import VeeValidate from 'vee-validate';
import App from './App.vue'
Vue.config.productionTip = false
Vue.use(VeeValidate);
new Vue({
render: h => h(App),
}).$mount('#app')
In my App.vue file I do include ValidationProvider as a component:
<script>
import CriteriaDataModel from './data-model/criteria-data-model.js';
import UserDataModel from './data-model/user-data-model.js';
import { ValidationProvider } from 'vee-validate';
export default {
name: 'app',
data: function() {
return {
criteriaModel: CriteriaDataModel,
completeMessage: null,
form: {
user: UserDataModel
}
};
},
components: {
ValidationProvider
}
};
</script>
I also tried changing my Vue initialization to this without it helping:
new Vue({
render: function (h) { return h(App) },
}).$mount('#app')
I observed that VeeValidate has many usages of the '=>' syntax (referenced in the other stack overflow as being the problem) in the node_module, but since the intention is to use it for Vue, I question whether that is the problem.
ValidationProvider
is a component which you should register it withVue.component
.Vue.component('ValidationProvider', ValidationProvider)
– AntiphonyValidationProvider
is an constructor that return byVue.extend
which you can create a instance withnew
or register a global component withVue.component
– Antiphony