Nuxt 2 & Vuelidate 2 not working properly - vue.js

Question

I have installed vuelidate 2 to validate forms in my NuxtJS project. I followed instructions for installation and setup according to vuelidate documentation. This is how my setup files look until now:
Package.json
"dependencies": {
"#nuxtjs/axios": "^5.13.6",
"#vue/composition-api": "^1.6.1",
"#vuelidate/core": "^2.0.0-alpha.41",
"#vuelidate/validators": "^2.0.0-alpha.29",
"core-js": "^3.19.3",
"nuxt": "^2.15.8",
"vue": "^2.6.14",
"vue-server-renderer": "^2.6.14",
"vue-template-compiler": "^2.6.14",
"vuelidate": "^0.7.7",
"webpack": "^4.46.0"
},
plugins/composition-api.js for #vue/composition-api
import Vue from 'vue'
import VueCompositionAPI from '#vue/composition-api'
Vue.use(VueCompositionAPI)
plugins/vuelidate.js
import Vue from 'vue'
import Vuelidate from 'vuelidate'
Vue.use(Vuelidate)
nuxt.config.js
plugins: [
{ src: '~/plugins/composition-api.js' },
{ src: '~/plugins/vuelidate' },
],
components/form.vue
<template>
<form #submit.prevent="submitForm">
<div>
<label for="name">Name:</label>
<input v-model="name" type="text" name="name" />
</div>
<button>Submit</button>
</form>
</template />
<script>
import useVuelidate from '#vuelidate/core'
import { required } from '#vuelidate/validators'
export default {
setup() {
return { v$: useVuelidate() }
},
data() {
return {
name: '',
}
},
methods: {
submitForm() {
this.v$.$validate().then((isFormValid) => {
if (isFormValid) {
console.log('valid!!!', this.$v)
} else {
return console.log('false', this.$v)
}
})
},
},
validations() {
return {
name: {
required,
},
}
},
}
</script>
These are a couple of problems that occur:
When I place v-if="v$.name.$error" inside template I get the error Cannot read property 'name' of undefined.
When I call submitForm method, the validation of isFormValid works properly. When I open the console to observe $v.errors, $v.dirty, or $v.invalid, I see this error inside the array:
[Exception: RangeError: Maximum call stack size exceeded at Watcher.depend (webpack-internal...