Items from assets directory not showing in either ionic serve or ionic cordova run

Question

Images and svgs from assets directory are not showing in the ionic serve. Seems the assets folder is not copying in the www directory during build.

My project directory structure is:
-src
--app
--assets
---icon
---svg
--environments
--theme

I have already tried adjusting the src location of the images and svgs. But it seems none of them worked!

Path that I already tried:
assests/
/assests/
./assests/
../assests/
../../assests/

Error in the console says:
GET http://localhost:8100/icon/cash-round.png 404 (Not Found)
GET http://localhost:8100/svg/md-apps.svg 404 (Not Found)
GET http://localhost:8100/svg/md-send.svg 404 (Not Found)

Here is the code of the html file:

<ion-header>
    <ion-toolbar>
        <ion-title>
            <img src="icon/cash-round.png"> Welcome
        </ion-title>
    </ion-toolbar>
</ion-header>

<ion-content>
    <ion-card class="welcome-card">
        <ion-card-header>
            <ion-card-subtitle>Get Started</ion-card-subtitle>
            <ion-card-title>Welcome to Ionic</ion-card-title>
        </ion-card-header>
        <ion-card-content>
            <p>Now that your app has been created, you'll want to start building out features and components. Check out some of the resources below for next steps.</p>
            <button id="demo">Click me</button>
        </ion-card-content>
    </ion-card>

</ion-content>

Let me know if I have to install any package to show image or changes in the other files like package.json or angular.json

Ira Watt Ira Watt · Accepted Answer · 2019-04-07T22:16:54

this is how to refer to the assets folder

<ion-img src="/assets/shapes.svg"></ion-img>

ionic serve uses src not www i believe

cmd - ionic start example sidemenu has an example in the home screen

Items from assets directory not showing in either ionic serve or ionic cordova run

1 Answers