In my project folder assets/imgs I added several jpg images (e.g. …/…/assets/imgs/IMG1.jpg). If I run the project within a browser (ionic serve) the photos are shown as expected. If I build (ionic cordova build android) the app and run it on my phone or on the emulator the pictures are not shown instead a picture indicating a broken link. Do I specifically have to include the photos?
i had this problem,i solved it by checking the name of the image and caps lock.
For example:
assets/imgs/Hello.png
my image was hello.png and not Hello.png
Yeah that happened to me too as @saidmrn posted. I would recommend to always write your images in lowercase and use dashes and not underscore/spaces/camelcases for the names of the images. Also .png while heavier makes the pictures look way better, so use that.
1 Like
I changed all the letters to small ones, am not using any underscores or spaces and changed the files to png. Still the same problem. Any more ideas?
Hello,
everything wil be copied into www folder. So you must reference from the view of index file.
In your case …/…/assets/imgs/IMG1.jpg is in src available as long you serve to the browser, because rthere is a src folder. When you build your app, then there is no src folder and path is broken.
Depending from where you reference, then your url/path is different.
In Html for an ing tag it would be
<img src='assets/yourfolder/yourfilename.png'>
A background image from from. scss looks like
.yourcssclass{
background-image: url('../assets/yourfolder/yourfilename.png') no-repeat;
}
Maybe it helps.
Best reagards, anna-liebt
3 Likes