title: How to configure Webpack to display images uploaded on-the-fly in a certain directory?
body: <p>My app is a JHipster app, which is shipped with Webpack.  </p>
  
  <p>I upload images via a java REST API, then they are put in a directory within the webapp (named "photos/").<br>
  To display them in the webapp, I send a JS object including the image url in the angular/JS script.<br>
  Also I want to be able to access them directly with their URL. I'd want also using a directory that would not be erased in future builds.  </p>
  
  <p>I can't manage to configure properly webpack : I get an html 404 error ( from inside the webapp, and by direct URL )<br>
  All the infos I can get for now concern static image displayed from inside the webapp, and I don't get how to adapt for my issue.  </p>
  
  <p>I've added this in webpack.common.js  </p>
  
  <pre><code>         {
                test: /photos\/.*\.jpg$/i,
                loader: 'file-loader',
                options: {
                  name: '[name].jpg',
                  outputPath: 'photos/',
                  publicPath: 'photos/'
              }
            },
  </code></pre>
  
  <p>Here's the HTML bit associated</p>
  
  <pre class="lang-html prettyprint-override"><code>                &lt;dd *ngFor="let path of observation.imagesPath" &gt;
                      &lt;div&gt;
                          &lt;a href="{{path}}"&gt;
                              &lt;img class="t_imageGalery" src="{{path}}" /&gt;
  
                          &lt;/a&gt;
                      &lt;/div&gt;
                  &lt;/dd&gt;
  </code></pre>
  
  <p>Sorry if I'm missing something obvious, it's my first app with webpack.</p>