0

I have an angular application and I run the ng build --prod command and deployed the files in the dist folder to the apache server /www/html/mywebsite folder in a ubuntu VM in DigitalOcean.

After the build of the angular application, the images called inside CSS files have come to the front directory even though originally they are in the assets directory as shown in the below screenshot.

Those images are showing fine without any issue in the website, but all the images called inside the HTML files are not displaying on the website. I don't think there is a permission issue to the assets folder because the javascript files inside the assets folder are loading without any issue. Here I have attached a screenshot of the permission of the files inside the assets folder.

Can you please help me to solve this?

This is a screenshot of files inside the dist folder after the ng build --prod

enter image description here

Improve this question
7
  • In the network tab, filter the request by image and check the error for those images. Post that screenshot if possible. Commented Aug 14, 2021 at 19:00
  • @RiteshWaghela It shows 404 Error in the status. Commented Aug 14, 2021 at 19:08
  • What path is building for those images? Also check your angular.json file where assets are configured. Commented Aug 14, 2021 at 19:10
  • @RiteshWaghela in the angular.json file, "assets": [ "src/assets" ], Commented Aug 14, 2021 at 19:20
  • Have your index.html has base href set? what is the value? Commented Aug 14, 2021 at 19:24

1 Answer 1

Reset to default
1

Since you are setting up base href value in your index.html file like this:

<base href="/sedsslweb/sedssl/">

in your template you will need to access images without a leading slash, like this, so that they will form correct path:

<img class="rounded-circle mx-auto" src="assets/images/Projects/serendib.png">

I just checked in dev tool by editing images path without leading slash, and could see the images loading fine.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Happy to help @Sanindu :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.