so I have my own npm module made by vue js (REPO-A), let's say I install this module on my project (vue js too) (REPO-B). And I use an avatar component from that module, previously I have added an @error handler on my <img> tag like this to make the image default when something went wrong with the image resource,

handleErrorImage(e) {
  if (e.type === "error") e.target.src = require("../assets/defaultImage.svg")
}

it works as expected if I run on REPO-A and get the defaultImage.svg with the right path, but it's not working if I run on REPO-B, and I tried to look at the network panel, I think if I run on REPO-B the resource of the defaultImage.svg was the wrong path like this

RUN ON REPO-A

RUN ON REPO-B

the question is, how to make the defaultImage.svg path load correctly if the avatar component is used in REPO-B, thanks in advance