pixijs: pixi.js 5.1.5 - "Cannot read property 'start' of undefined"

For anyone who ran into this issue, did some debugging and found that one potential cause was missing the line:

Renderer.registerPlugin("batch", BatchRenderer);

In my particular case, it’s because I was trying to reduce size and removed the import to pixi.js and instead started importing each module, such as @pixi/core etc. By not importing pixi.js I was missing the Renderer.registerPlugin calls, as well as several other plugins.

“Remove package.lock and node_modules” helped. Thanks!

Known bug. Two versions of pixi exist at the same time, renderers are registered in only one of them.

“Remove package.lock and node_modules” helps.

We have a number of threads in forums & here, all closed.

Personally, I dont know what to do about it, except “throw webpack away, use vanilla js!”

I had the same issue when I was updating pixi to 6.5.8 version and building it by modules (not installing the whole pixi.js or pixi.js-legacy but installing it like:

    "@pixi/app": "6.5.8",
    "@pixi/constants": "6.5.8",
    "@pixi/core": "6.5.8",
    "@pixi/display": "6.5.8",
    "@pixi/extensions": "6.5.8",
    "@pixi/graphics": "6.5.8",
    "@pixi/math": "6.5.8",
    "@pixi/mesh-extras": "6.5.8",
    "@pixi/settings": "6.5.8",
    "@pixi/sprite": "6.5.8",
    "@pixi/text": "6.5.8",
    "@pixi/utils": "6.5.8"

The reason of this error: “Cannot read property ‘start’ of undefined” was not adding full pixi like “pixi.js” or “pixi.js-legacy” to the project. When in whole my project was no “pixi.js” import like import {Point} from "pixi.js" - this issue happened.

When we create the new Application like this:

        new Application({
            backgroundAlpha: 0,
            antialias: true,
            width: window.innerWidth,
            height: window.innerHeight,
            autoDensity: true,
            resolution: window.devicePixelRatio || 1
        });

It creates Renderer to render the stage - every object that is in canvas. But for rendering Renderer needs the “batch” plugin. When we install the full pixi.js it is there by default. You can check it in any Renderer. But when we do not import “pixi.js” or “pixi.js-legacy” in the whole project and use only its modules (to optimise project size for example) - the plugins property is empty. And when the Renderer tries to render - it can’t find the batch plugin and this issue happens.

The solution: We need to add batch plugin. (As TrevorSundberg said) For pixi version below 6.5.0 use Renderer.registerPlugin("batch", BatchRenderer); If your pixi version is upper as mine use this:

      // install "@pixi/core" and "@pixi/extensions" packages
      
      import {BatchPluginFactory} from "@pixi/core";
      import {extensions, ExtensionType} from "@pixi/extensions";

       const BatchRenderer = BatchPluginFactory.create();
        extensions.add({
            name: 'batch',
            ref: BatchRenderer,
            type: ExtensionType.RendererPlugin,
        });

I could explain something wrong, and will be glad if you will correct me. Hope this will help someone.

Just want to add that i could not get pixi.js to work above ^6.0.0 in a brand new Vue 2.6 project. Just did npm install pixi.js and added the default/recommended import for the new instance:

import * as PIXI from 'pixi.js';

Which would cause the same error as described above, as soon as i call render(). I just went back to 5.3.12 instead.

I really think you should investigate this. If the first experience users have, is this, i wouldn’t be surprised if most jump ship, which would be regrettable.

I had the same issue with v6.2.0. I downgraded to v6.1.3 and it worked.

It happened again.

I had the following dependencies in my package.json: "pixi-filters": "3.1.1", "pixi.js": "5.2.2"

• New 5.2.3 pixi.js version has been released.
• I still have “pixi.js”: “5.2.2” as a dependency.
• After npm install some pixi.js dependencies in package-lock.json are pointed to 5.2.3 some are still to 5.2.2.

Solution in my case:

• Update my pixi.js dependency to 5.2.3
• Clear node_modules and package-lock.json
• npm install
• Now all pixi.js dependencies are pointed to 5.2.3 versions, so there are no versions conflict now and issue is solved.

I run yarn remove pixi.js-legacy and fixed it. I think the pixi.js-legacy module messes up with the regular pixi. Or maybe the versions of pixi and pixi.js-legacy don’t match. Didn’t had time to investigate.