title: How to reference images in lazy loaded modules in Angular 2\4?
body: <p>I have some images that I need to share across the application. I have 2 lazy loaded modules. Login and Overview. I have stored the image in src/assets/images/logo.png and want to use this image in both Login and Overview. </p>
  
  <p>My current project structure is :
  (prefixed numbers are levels, just for reference)</p>
  
  <pre><code>-0_ProjectName
   -1_src
     -2_assets
       -3_images
         -4_logo.png
     -2_modules
       -3_login
         -4_containers
           -5_login.component.scss
           -5_login.component.ts
           -5_login.component.html
       -3_overview
         -4_containers
           -5_overview.component.scss
           -5_overview.component.ts
           -5_overview.component.html
  </code></pre>
  
  <p>How can I reference src/assets/images/logo.png inside Login and Overview in respective scss files of the modules? I if try to give the image path in scss(login.component.scss and overview.component.scss) as "../../../assets/images/logo.png" (3 directories up), it keeps throwing a message saying image is not found.  </p>
  
  <p>Error log:
  ./src/modules/login/containers/login.component.scss
  Module not found: Error: Can't resolve '../../../assets/images/logo.png' in 'C:\Users\deepak\A2Workspace\ProjectName\src\modules\login\containers'</p>