Create custom Input Component in lib

[Johannes-Schiel]

Hello, i am new to vue and vee-validate.

my plan is to create a shared component lib with vue because we have multiple projects. Can i create a custom input field with useField and import that to my projekt so it works with useForm?

Because at this moment i can use my custom field just fine when it is part of my project but when i import it from my lib, there is no "link" between my input component and my useForm.

<template>
<!-- works just fine, in my project -->
<Input name="name" type="text"  label="Vorname"/>
<!--  dont work -->
<LibInput name="name" type="text"  label="Vorname"/>
</template>

<script>
import Input from './../components/Input.vue'
import { LibInput } from 'my-custom-lib'

export default {
  name: 'Home',
  components: {
    Input,
    LibInput 
  },
....
}
</script>

both components are exactly the same only the name is different

[logaretm]

I think this is a bundling issue, your project might be importing vee-validate and the component lib importing their own instance as well.

Generally, this is a bundler configuration issue. whatever bundler you are using you need to set vee-validate as an external so your project correctly uses the same vee-validate installation.

[Johannes-Schiel]

Worked perfectly

[Johannes-Schiel]

Ok, thanks for the answer i will try that tomorrow.