title: Webpack [url/file-loader] is not resolving the Relative Path of URL
body: <p>I am facing a problem in Webpack regarding Relative Path. 
  Let me try to explain the scenario : </p>
  
  <p>I have 2 separate project in <strong>Workspace directory</strong> :</p>
  
  <ol>
  <li>Project-A [Bundling using Gulp] : <strong>Stable &amp; Working</strong></li>
  <li>Project-B [Bundling using Webpack] : <strong>New project</strong></li>
  </ol>
  
  <p>As both the projects are using same Styling, so I wanted to reuse the SCSS files [consisting of standard variables, predefined layouts, modals, classes etc] of <strong><em>Project A into Project B</em></strong>.</p>
  
  <p><a href="https://i.stack.imgur.com/jMZh9.png" rel="noreferrer"><img src="https://i.stack.imgur.com/jMZh9.png" alt="enter image description here"></a></p>
  
  <p>Now, if I am trying to import Project-A index.scss in Project-B index.scss as another partial [<em>Commenting out the Background Image URL Depency</em>], webpack is able to generate the required CSS output file.</p>
  
  <pre><code>// Import Project A SCSS [Common Varibles, Classes, Styling etc] 
  @import "../../../../Project_A/assets/stylesheets/index";
  </code></pre>
  
  <p>But as Project-A's index.scss is further referring background images from the respective Relative-Path, the webpack build is throwing error </p>
  
  <blockquote>
    <p>'File / dir not found in XYZ/Project-B/Source/Stylesheets'.</p>
  </blockquote>
  
  <p>Exact Error Block : </p>
  
  <blockquote>
    <p>ERROR in ./src/assets/stylesheets/index.scss
    Module build failed: ModuleNotFoundError: Module not found: Error: Cannot resolve 'file' or 'diWorkSpace\Project_B\src\assets\stylesheets</p>
  </blockquote>
  
  <p>screenshot : 
  <a href="https://i.stack.imgur.com/IfQv2.png" rel="noreferrer"><img src="https://i.stack.imgur.com/IfQv2.png" alt="**enter image description here**"></a></p>
  
  <p>I am not able to understand, <strong>why Webpack is not able to resolve the Relative path of assets inside Project-A and still looking inside 'Project B'</strong>.</p>
  
  <p>Here is the Code-Repo URL for the simulated issue : 
  <a href="https://github.com/raviroshan/webpack-build-issue/tree/master/WorkSpace" rel="noreferrer">https://github.com/raviroshan/webpack-build-issue/tree/master/WorkSpace</a></p>
  
  <p><strong>Steps to reproduce.</strong></p>
  
  <ol>
  <li>Download the Repo. </li>
  <li>Browse inside Project_B folder, and do a NPM install. </li>
  <li>Run 'webpack'. It would build correctly as Relative Image
  URL code is commented out. </li>
  <li>Now put back the commented line of code :  <a href="https://github.com/raviroshan/webpack-build-issue/blob/master/WorkSpace/Project_A/assets/stylesheets/index.scss#L27" rel="noreferrer">https://github.com/raviroshan/webpack-build-issue/blob/master/WorkSpace/Project_A/assets/stylesheets/index.scss#L27</a></li>
  </ol>