How to (really) prevent pinch zoom on mobile devices

Question

I have found various posts on this, many suggest adding this:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

but according to ho posts like this disable viewport zooming iOS 10+ safari?, Apple devices overrule it these days.

Now I tried the solution on above mentioned post, which is:

componentDidMount(){
    document.addEventListener('touchmove', function (event) {
                if (event.scale !== 1) { event.preventDefault(); }
              }, false);
}

but this gets me an error [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See <URL>

which, after a quick Google seems to be more Chrome related. And also: it does not work - the users can still pinch zoom. edit: this seems to actually do the trick for some Android devices, while iOS devices still allow the pinch zoom.

My website is built in react - redux. How can I make it impossible for mobile users to zoom in and out?