Serve gzip files in node throws net::ERR_CONTENT_DECODING_FAILED in browser

I'm trying to follow this in order to serve some static compressed files. https://medium.com/@rajaraodv/two-quick-ways-to-reduce-react-apps-size-in-production-82226605771a

I'm using webpack compression plugin to generate the gzip files.

new CompressionPlugin({
    asset: '[path].gz[query]',
    algorithm: 'gzip',
    test: /\.(js|css)$/,
    deleteOriginalAssets: true
})

On my server I have this middleware.

app.get('*.js', function (req, res, next) {
    req.url = req.url + '.gz';
    res.set('Content-Encoding', 'gzip');
    next();
});

When I'm running the app, in browser I'm getting GET http://localhost:8080/app.js net::ERR_CONTENT_DECODING_FAILED

Probably, I still have to do something more but no idea what exactly.

Thank you, Ionut

via Ionut Cirja