JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/3.0.9/pixi.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r74/three.js"></script>
<canvas width="800" height="600"></canvas>

JavaScript

// another way around
var canvas = document.querySelector('canvas');
var renderer3d = new THREE.WebGLRenderer({ canvas: canvas });

PIXI.WebGLRenderer.prototype._createContext = function () {
    // hack 3js context into pixi's renderer
    this.gl = renderer3d.getContext ();

    this.glContextId = PIXI.WebGLRenderer.glContextId++;
    this.gl.id = this.glContextId;
    this.gl.renderer = this;
};


var renderer = new PIXI.WebGLRenderer(800, 600,{view : canvas, backgroundColor : 0x1099bb});

// create the root of the scene graph
var stage = new PIXI.Container();

// create a texture from an image path
var texture = PIXI.Texture.fromImage('https://pixijs.github.io/examples/_assets/basics/bunny.png');

// create a new Sprite using the texture
var bunny = new PIXI.Sprite(texture);

// center the sprite's anchor point
bunny.anchor.x = 0.5;
bunny.anchor.y = 0.5;

// move the sprite to the center of the screen
bunny.position.x = 200;
bunny.position.y = 150;

stage.addChild(bunny);

// start animating
animate();
function animate() {
	requestAnimationFrame(animate);

	// just for fun, let's rotate mr rabbit a little
	bunny.rotation += 0.1;

	// render the container
	renderer.render(stage);
}