title: Minification/Optimization of the files required using webpack file-loader
body: <p>When I do <code>require('./something.html')</code> in my code and configure <a href="https://github.com/webpack-contrib/file-loader" rel="nofollow noreferrer">file-loader</a> to load html files something like this:</p>
  
  <pre><code>...
  module: {
      rules: [
          {test: /\.html$/, loader: 'file-loader', options: {name: '[name].[hash].html'}
      },
  }
  ...
  </code></pre>
  
  <p>Currently this will copy the original files to the configured output directory and replaces the <code>require</code> calls to those filenames with the generated file url. Which works perfectly.</p>
  
  <p>I'm wondering if it's possible to further process the files in someway like further minification or optimizationusing any other loaders. Or perhaps process them to optimize in some way using any hooks or similar. Not sure if <code>webpack</code> provides that kind of hooks.</p>
  
  <p>Is there any workaround to do this with <code>file-loader</code>?</p>
  
  <p>I tried something like this but it doesn't seem to work. It's not minified.</p>
  
  <pre><code>{
      test: /\.html$/, use: [
          {loader: 'raw-loader'},
          {loader: 'html-minify-loader'},
          {loader: 'file-loader'}
      ]
  }
  </code></pre>
  
  <p>Let me know if anybody has any workaround for this using webpack 2. Thanks.</p>
  
  <p><strong>Note:</strong> 
  I know there is <a href="https://www.npmjs.com/package/html-webpack-plugin" rel="nofollow noreferrer">html-webpack-plugin</a> for generating <code>index.html</code> which is not what I'm looking for. I'm working in angular js 1.x project and there are numerous template html files which I'm requiring using <code>file-loader</code> in the <code>templateUrl</code> to load them on the fly which already works great. Now I only need to minify those output template files. </p>