[Vuejs]-Can't load images from assets folder in nested components (Vue.js 2.0 / Webpack)

by

2👍

✅

require with a tilde(~) works because in the CSS files it resolves the path to your node_modules directory and you don’t have to set up a relative path.

In your case you are currently in the signup directory so you would have to go up 3 directories before you reach the assets directory.

So your relative path would become:

../../../assets/my-img.jpg

With Webpack you also have the option to resolve straight away to a directory with a resolve alias which might be a prettier option for you:

https://webpack.js.org/configuration/resolve/

Hope that helps.

👤Stephan-v

0👍

In CSS/SCSS use as follows:

background: url(../../../assets/logo.png);
👤Ravi Anand

Leave a comment