I am working on a Vue app and I need to access some image files from an included JS file for different purposes, such as adding images to a canvas element.
Usually, this task is simple with code like the following:
function getImage() {
let img = new Image();
img.src = '/assets/images/bg.jpg';
img.onload = function () {
//
};
}
Although I can technically access images in my public folder using this method, what if I want to access compiled image assets from my src folder instead of the public folder?
In CSS, I can easily use an @ symbol in the path like @/assets/images/bg.jpg by configuring it as an alias in the vue config. So, I tried...
img.src = '@/assets/images/bg.jpg';
...but unfortunately, this did not work.
Is there a way to achieve this, or is what I'm attempting not possible? It's possible that assets referenced only in JS are not included in the build process. Thank you