Imported dependency requires another dependency to be first available in scope

Question

I'm trying to import a library that extends another one , here's my first approach:

import * as PIXI from 'pixi.js';
import 'pixi-layers'; // extends PIXI classes

I get an Uncaught ReferenceError: PIXI is not defined on runtime when pixi-layers tries to Object.assign on a PIXI class.

I suppose this is related to how webpack's hoisting, I've tried to use:

• imports-loader
• script-loader
• I've also tried to provide PIXI through webpack:

module.exports = {
    // ...
    plugins: [
        new webpack.ProvidePlugin({
            PIXI: 'pixi.js',
        }),
    ],
};

PIXI remains unavailable to pixi-layers , how can I bundle pixi-layers and make sure it can actually work with the PIXI object?

Answer 1

Turns out providing PIXI as a plugin through the webpack config file was the solution, I just has this same config file compile in the wrong location (paths are hard).