I have an ionic/cordova app I am building. When developing in the browser I have no issues but when I build and run on devices or emulators they can't find my images. I have verified that the images are getting copied over to the platform projects, but do I have to do something special to be able to use them? For android, they are getting copied into assets/www/images and I am trying to reference them in my css using something like:
.myImage{
height: 20px;
width: 20px;
background: url('/images/my_image.png') no-repeat;
}
but in the console I get a 404 Not Found error on both ios and android. What am I doing wrong?
Try this:
background: url('./img/my_image.png') no-repeat;
So I'm actually not sure why it does this, but the app root is not www like you would expect. After inspecting things with chrome's remote debugging, I found the root of the app was android_www. The reason it couldn't find my image is because according to the app, the location was android_www/www/img/my_image.png. By using relative pathing, I was able to load the image. The css looked like this (my css folder was a sibling to my img folder):
background: url('../img/my_image.png') no-repeat;