Pixi.js: Cargue recursos de imagen para PIXI.js junto con Webpack

Estoy tratando de cargar activos de imagen para PIXI.js en un proyecto mío de React que usa Webpack. Aquí está toda mi clase de componente 'Menú':

import React from 'react';
import styles from './Menu.css';
import backgroundUrl from './background.jpg';
require('pixi.js')

class Menu extends React.Component {    

    componentDidMount () {

        // Get reference to canvas element
        this.canvas = this.refs.canvas;        

        // Load assets                
        PIXI.loader.add([
            {
                name: 'background',
                url: backgroundUrl
            }
        ]).load(this.init());

    }

    init () {

        // Create background sprite
        const background = new PIXI.Sprite(PIXI.loader.resources.background.texture);

        // DEBUG: Height and width is always '1'
        console.log('Background width: ' + background.width);
        console.log('Background height: ' + background.height);

        // Setup renderer
        this.renderer = PIXI.autoDetectRenderer(background.width, background.height);
        this.renderer.autoResize = true;
        this.renderer.resize(window.innerWidth, window.innerHeight);
        this.canvas.appendChild(this.renderer.view);

        // Create stage
        this.stage = new PIXI.Container();                

        // Add background to stage
        this.stage.addChild(background)

        // Tell the renderer to render the stage
        this.renderer.render(this.stage);

    }

    render () {

        return (
           <div className={styles.canvas} ref='canvas'></div>
        );
    }

}

export default Menu;

Ahora, como puede ver, estoy intentando cargar la imagen background.jpg en PIXI con la función loader.add() . Simplemente no funciona. En los registros de mi consola de depuración puedo ver que la altura y el ancho de la imagen es 1. Además, cuando veo la URL de la imagen de fondo, todo parece estar bien. ¿Algun consejo?