How to connect an external *.js file to the *.vue component?

Question

JavaScript

There is a project on vue.js
-src
|--assets
|--components
|--- component.vue
|--router
|---index.js
|--script
|--- hover.js
|--App. vue
|--main.vue
The meaning is this. I need to include the hover.js file in component.vue and place the following code:

Array.from(document.querySelectorAll('.grid__item-img')).forEach((el) => {
      const imgs = Array.from(el.querySelectorAll('img'));

      new hoverEffect({
        parent: el,
        intensity: el.dataset.intensity || undefined,
        speedIn: el.dataset.speedin || undefined,
        speedOut: el.dataset.speedout || undefined,
        easing: el.dataset.easing || undefined,
        hover: el.dataset.hover || undefined,
        image1: imgs[0].getAttribute('src'),
        image2: imgs[1].getAttribute('src'),
        displacementImage: el.dataset.displacement
      });
});

Tried

import { hoverEffect } from '../script/hover.js'
// и
import '../script/hover.js'

But nothing wants to work. Can you tell me exactly where to put all this?

Answer 1

Let 's go here and see how to connect effects for correct work, you need to hang them after mounted, and monitor the change in the list of pictures, if something has changed, then hang the hover effect on new pictures. Perhaps he himself knows how to replace himself, then it will be enough just to hang it again on all the pictures. But for more specific information, you need to look at how this hover itself is arranged.

Answer 2

import hover from '../script/hover.js'
This code should import correctly. If it doesn't import like that, then the problem is in the file. Does it actually have an export?
If hoverEffect creates an effect by manipulating the DOM directly, then it might not work because it conflicts with vue, which renders the page by manipulating the Virtual DOM.
In any case, describe in more detail what exactly you want to do (a task, and not just "here is the code to connect"), what kind of library you are using, what errors come up.