How to import vForm globally in index.js using Vue js 3

736 Views Asked by At

I want to register vForm in index.js globally in Vue js 3 but not work, while using vuejs 2 it work like Vue.component(Form) in Vue Vue js 3 how to define once and usable in all window or component, this bellow code not working. Thanks for your comment and soon response.

import { Form, HasError, AlertError } from 'vform';
app.use(Form);
app.use(HasError);
app.use(AlertError)
2

There are 2 best solutions below

4
IVO GELOV On

Well, it works the same in Vue 3 - but instead of using the global Vue you use your app:

import { createApp } from 'vue';
import App from './App.vue';
import router from './router'; 
import { Form, HasError, AlertError } from 'vform';

const myApp = createApp(App);
myApp.use(router);
myApp.component('v-form', Form);
myApp.component('has-error', HasError);
myApp.component('alert-error', AlertError);
myApp.mount('#app'); 
0
Boosuro On

This what i will do in Vue 3

import App from "@/components/App";
import Form from "vform";
import { HasError, AlertError } from "vform/src/components/bootstrap5";

HasError and AlertError can also be imported from vform/src/components/bootstrap4

const app = createApp(App);
window.Form = Form;
app.component("has-error", HasError);
app.component("alert-error", AlertError);