auth0-blog / react-flux-jwt-authentication-sample

Sample for implementing Authentication with a React Flux app and JWTs
589 stars 102 forks source link

bug when I build the project #7

Closed MarioPatch closed 9 years ago

MarioPatch commented 9 years ago

LoginStore.js: Line 9: 'this' is not allowed before super() while parsing file

ghost commented 9 years ago

Please try this one

constructor() {
    super();
    this.dispatchToken = AppDispatcher.register(this._registerToActions.bind(this));
    this._user = null;
    this._jwt = null;
  }
MarioPatch commented 9 years ago

I had already try this but sorry, it doesn't work. No bug on build but in my js console : "Uncaught TypeError: undefined is not a function"

mgonto commented 9 years ago

Hmmm. That's weird. What version of Babel are you using?

ralphschindler commented 9 years ago

Same problem here with these versions:

├─┬ babelify@6.1.0
│ ├── babel-core@5.3.1
│ └── through2@0.6.5

related: https://github.com/babel/babel/issues/1131 https://github.com/babel/babel/issues/1284

mgonto commented 9 years ago

But I'm calling super. I'll check it out.

Any recommended fix?

kyawmoehaynes commented 9 years ago

I'm having the same issue. Is there any fix yet?

mgonto commented 9 years ago

I'm checking it tomorrow to see if I have the same problem. I'll update it then :).

ralphschindler commented 9 years ago

I believe you have 2 options.

The first is to move scope specific calls to their own method inside BaseStore.js:

...
  // instead of inside ctor
  subscribe(actionSubscribe) {
    this._dispatchToken = AppDispatcher.register(actionSubscribe());
  }
...

Which would require you to call them directly after super() in LoginAction.js:

  constructor() {
    super();
    this.subscribe(() => this._registerToActions.bind(this));
}

OR, you can use the prototype and use the assumed this in the parent class, ala:

class BaseClass {
    constructor (action) {
        action.call(this);
    }
}

class MyClass extends BaseClass {
    constructor() {
        super(() => MyClass.prototype.mycallback());
        console.log(this.x);
    }
    mycallback () {
        this.x = 5;
    }
}

var mc = new MyClass;
mgonto commented 9 years ago

Thanks @ralphschindler, with your help I solved the problem with your recommendation #1, which I liked more.

Closed!