Using Vform with Nuxt JS

Is there any way I can use Vform with Nuxt JS as a plugin? https://nuxtjs.org/guide/plugins/

So that I don’t have to add below code on all the pages?

import { Form, HasError, AlertError } from 'vform'
Vue.component(HasError.name, HasError)
Vue.component(AlertError.name, AlertError)

I tried to create plugin by adding a vform.js file inside nuxt plugins folder

import Vue from 'vue'
import { Form, HasError, AlertError } from 'vform'

Vue.component(HasError.name, HasError)
Vue.component(AlertError.name, AlertError)

But when on any nuxt page if I do new Form() , it says “Form” is not defined.

[cretueusebiu]

Try this: https://github.com/cretueusebiu/vform/issues/30#issuecomment-412006708

[ashik-ahmed-dev]

import Vue from ‘vue’; import { Form, HasError, AlertError, AlertSuccess } from ‘vform’; Vue.component(HasError.name, HasError); Vue.component(AlertSuccess.name, AlertSuccess); Vue.component(AlertError.name, AlertError);

export default ({ app }, inject) => { Form.prototype.submit = function submit(method, url, config = {}) { this.startProcessing();

const data = method === 'get' ? { params: this.data() } : this.data();

return new Promise((resolve, reject) => {
  app.$axios
    .request({
      url: this.route(url),
      method,
      data,
      ...config
    })
    .then(response => {
      this.finishProcessing();
      resolve(response);
    })
    .catch(error => {
      this.busy = false;

      if (error.response) {
        this.errors.set(this.extractErrors(error.response));
      }

      reject(error);
    });
});

};

app.$vform = (…params) => new Form(…params); inject(‘vform’, (…params) => new Form(…params)); };