marzipano: glslify is not compatible with Webpack

Next problem from my environment (ReactJS / Webpack generated by create-react-app):

I’m trying to integrate ReactJS with Marzipano, however I’m now stuck on an issue of nothing but a white screen being rendered, with no errors in the console.

Marzipano appears to be loading, however, as the div I’m binding it to has been resized, and if you click and drag the cursor changes to a closed hand, which would not be the default behavior. My code looks like this:

import React, { Component } from 'react';
import './App.css';
import Marzipano from 'marzipano';

class App extends Component {
  componentDidMount() {
    this.panoViewer = new Marzipano.Viewer(this.pano);

    // Create source.
    var source = Marzipano.ImageUrlSource.fromString(
      "img/test.jpg"
    );

    // Create geometry.
    var geometry = new Marzipano.EquirectGeometry([{ width: 4000 }]);

    // Create view.
    var limiter = Marzipano.RectilinearView.limit.traditional(1024, 100*Math.PI/180);
    var view = new Marzipano.RectilinearView({ yaw: Math.PI }, limiter);

    // Create scene.
    var scene = this.panoViewer.createScene({
      source: source,
      geometry: geometry,
      view: view,
      pinFirstLevel: true
    });

    // Display scene.
    scene.switchTo();
  }
  render() {
    return (
      <div className="App">
        <h1>Pano Test</h1>
        <div ref={pano => this.pano = pano} />
      </div>
    );
  }
}

export default App;

I was following the source code of the example here. The only thing I changed is the image source, but to be safe I did also test with the original image in the example.

My only thought after looking around on the web is perhaps this is a WebGL texture thing… But I don’t think it’s a max texture size issue, because if it was then the example I linked above wouldn’t work on my device, and it does.