How to import a local Vanila Js file in a Vue component of Laravel?

Question

good day!

I have a Vanila Js file having an Errors class like this in public\js\errors.js.

class Errors {
  constructor() {
      this.errors = {};
  }
  get(field) {
      if(this.errors[field]) {
          return this.errors[field][0];
      }
  }
  record(errors) {
      this.errors = errors;
  }
}

export default {
  Errors
}

I have a Vue component called Material in resources\js\components\materials\Material.vue in which I want to use the instance of the Errors class as a data property.

export default {
    props: [
        // 
    ],
    data() {
        errors: new Errors(),
    },
    mounted() {
        //
    },
    methods: {
        //
    },
}

What is the best approach to make use of the Errors class in the component?

Answer 1

You can import on top of your script tag. Will be something like this:

import { Errors } from '..\js\errors.js'