Cannot find image src path?

[andywd7]

Hi,

I may be missing something but I can't work out the path for an image stored in assets folder? I have added an imgs folder to the assets folder so it's path is src/assets/imgs/logo.png and am trying to use it in an <img src="src/assets/imgs/logo.png" /> in an element component but no matter what path I try it cannot be found.

Is there something I am doing wrong or need to do?

Thank you

[arielsalminen]

@andywd7 No worries at all, hope I can help! The reason that doesn’t work is because all static assets are included using Webpack. You can get the src root directory by using @, so the correct path would look like this:

<img src="@/assets/imgs/logo.png" />

I hope this helps. If still having issues just let me know. I’ll add something about this to documentation soon as well (with the 2.0.0 release that’s coming probably later this week: https://github.com/viljamis/vue-design-system/pull/56).

[arielsalminen]

Added a note to myself on the todo list in 2.0 release pull

[andywd7]

Thank you for such as speedy response. That works perfectly in a component <template but does not work in <docs> or in a markdown file?

Thanks

[arielsalminen]

@andywd7 Sorry for that. I released a fix for this in Vue Design System 2.0.0. There’s also a new FAQ section for this: https://github.com/viljamis/vue-design-system/wiki/Frequently-Asked-Questions-(FAQ)#how-do-i-use-static-image-assets

[arielsalminen]

@andywd7 Let me know if you can’t currently update to 2.0.0 as it’s also possibly to change a few things to get it working in the version you’re using currently (I can provide instructions).

[andywd7]

@viljamis Awesome job. Updated to v2 fairly easily and img src works great! Keep up the great work!

Thanks

[arielsalminen]

👍