Where do images go in Ionic 2


#1

I am just getting started with Ionic 2. I have created an img file inapp inside it is a file logo.png. So I have created the following code:

css:

getting-started {
  .logo {
      background-image: url(./img/logo.png);
  }
}

html:

  <ion-col offset-33 width-33 class="logo"><h1>Logo</h1></ion-col>
  <h3>Welcome to your first Ionic app!</h3>

</ion-content>

I know the css is working, as if I toggle the background color, I get the expected results. However, I don’t get any background image, just the Logo text specified. Where should I have put the image file?

NB: I would like it bundled with the app, so it all works offline.


Where to put content images, cutouts in the folder structure?
#2

So images would still be placed in www/, since there’s no build process for the images.

Then you would link to the image based on paths that are relative to the index.html


#3

and as an addition: you should quote the url you’re referencing like this: background-image: url('../../img/appicon.png').

Use your element inspector to make sure if you’re referencing the right path.


#4

Using ionic view the img folder inside www not working


#5

Could be wrong here but shouldn’t the path to your images folder be

../img/logo.png