title: SyntaxError: illegal character is thrown only in firefox when serving the files with gzip
body: <p>I use webpack to bundle my application to bundle.gzip using the compress plugin.</p>
  
  <pre><code>new CompressionPlugin({
    asset: '[path].gz[query]',
    algorithm: 'gzip',
    test: /\.js$|\.css$|\.html$/,
    threshold: 10240,
    minRatio: 0.8,
  }),
  </code></pre>
  
  <p>And then I have an express server that serves the everything web pack has bundled and I add content-encoding to the response. </p>
  
  <pre><code>const path = require('path')
  const express = require('express')
  
  const app = express()
  const server = require('http').createServer(app)
  
  app.get('*.js', (req, res, next) =&gt; {
      req.url = `${req.url}.gz`
      res.set('Content-Encoding', 'gzip')
      next()
  })
  
  app.use(express.static(path.resolve(__dirname, 'dist')))
  app.get('*', (req, res) =&gt; {
      res.sendFile(path.join(__dirname, 'dist/index.html'))
  })
  // eslint-disable-next-line
  console.log("Server listening on port 8500")
  server.listen(8500)
  </code></pre>
  
  <p>This works well in every browser except for firefox which when I open the console see this.</p>
  
  <p><a href="https://i.stack.imgur.com/bjaFP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bjaFP.png" alt="enter image description here"></a></p>
  
  <p>What could the problem be I think the problem has something to do with the content-encoding</p>