Search code examples
cssimageangularangular2-routingstatic-files

Relative Path for static files like images/css/js etc


I have folder structure of /src/app/some-module/some-component and src/public/images/user.png. Now, when I am wiling to show an image in my some-component I have to give the path as ../../../public/images/user.png which seems to be too naive and wasteful effort once the number of images increase.

Do we have a routing mechanism or relative path in place in angular2 to serve static files. I am using the Angular2 with webpack.


Solution

  • It depends on how your base href looks like.

    For e.g if you have

    <base href="/src/">
    

    you may easily use below irrespective of where your component template is.

    <img src="public/images/user.png" />
    

    Hope this helps!!