Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: Doesn't work with a CRA 5.0.1 project #9064

Closed
tansanDOTeth opened this issue Jan 16, 2023 · 2 comments
Closed

Bug: Doesn't work with a CRA 5.0.1 project #9064

tansanDOTeth opened this issue Jan 16, 2023 · 2 comments

Comments

@tansanDOTeth
Copy link

tansanDOTeth commented Jan 16, 2023

Current Behavior

After installing pixi and importing it, this is the following error I am getting:

ERROR in ./node_modules/@pixi/core/lib/textures/resources/ImageBitmapResource.mjs
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /projects/test-project/node_modules/@pixi/core/lib/textures/resources/ImageBitmapResource.mjs: When using '@babel/plugin-transform-parameters', it's not possible to compile `super()` in an arrow function with default or rest parameters without compiling classes.
Please add '@babel/plugin-transform-classes' to your Babel configuration.

   6 |   constructor(source, options) {
   7 |     var __super = (...args) => {
>  8 |       super(...args);
     |       ^^^^^^^^^^^^^^
   9 |     };
  10 |     options = options || {};
  11 |     if (typeof source === "string") {

Expected Behavior

I expect it to run without errors.

Steps to Reproduce

  1. npx create-react-app pixi-test
  2. cd pixi-test
  3. npm install pixi.js
  4. Import pixi
import * as PIXI from 'pixi.js';
  1. npm run start
  2. Error shows

Environment

  • pixi.js version: e.g. 7.1.0
  • Browser & Version: e.g. Chrome 108
  • OS & Version: e.g. Ubuntu 22.04
  • Running Example: e.g. https://pixiplayground.com/

Possible Solution

Not really sure

Additional Information

Seems like babel added this change relatively recently and it was to prevent infinite recursion.

babel/babel#15148
babel/babel#15163

Here is the transpiled code:

class ImageBitmapResource extends BaseImageResource {
    constructor(source, options) {
      var __super = (...args) => {
        super(...args);
      };
      options = options || {};
      if (typeof source === "string") {
        __super(ImageBitmapResource.EMPTY);
        this.url = source;
      } else {
        __super(source);
        this.url = null;
      }
      this.crossOrigin = options.crossOrigin ?? true;
      this.alphaMode = typeof options.alphaMode === "number" ? options.alphaMode : null;
      this._load = null;
      if (options.autoLoad !== false) {
        this.load();
      }
    }
@SuperSodaSea
Copy link
Member

SuperSodaSea commented Jan 16, 2023

Duplicated with #8733 and #8824. This is a limitation of transpilation.
Workaround: Delete the "last 1 safari version" in your package.json.

@tansanDOTeth
Copy link
Author

Ah, that workaround makes a lot of sense if you don't need to explicitly support it. Thanks for replying so quickly!

I'll close this since it's a duplicate.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants