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

Magic in the emitter callback? #694

Open
crcdng opened this issue Mar 20, 2019 · 4 comments
Open

Magic in the emitter callback? #694

crcdng opened this issue Mar 20, 2019 · 4 comments

Comments

@crcdng
Copy link

crcdng commented Mar 20, 2019

Expected behavior

choo should accept valid JS code in the emitter callback.

Actual behavior

choo throws

"Unexpected token: punc ()) while parsing file: /app/index.js"

when an ES6 arrow function is used the emitter callback.

Steps to reproduce behavior

This is working code (adapted from the intro tutorial, running on glitch)

const choo = require('choo');
const html = require('choo/html');
const main = require('./templates/main.js');

const app = choo();

app.use(function (state, emitter) {
  state.animals = [
    { type: 'lion', x: 200, y: 100 },
    { type: 'crocodile', x: 50, y: 300 }
  ];
  
  emitter.on('addAnimal', function () {
    const obj = { type: 'lion', x: 100, y: 200 };
    state.animals.push(obj);
    emitter.emit('render');
  });
  
});

app.route('/', main);
app.mount('div');

When I replace function ()with () =>

emitter.on('addAnimal', () => {
   const obj = { type: 'lion', x: 100, y: 200 };
   state.animals.push(obj);
   emitter.emit('render');
 });

choo throws the above error. Some kind of magic going on?

@tornqvist
Copy link
Member

That's odd. I tried to reproduce the error but couldn't. Have I missed something here?
Source: https://glitch.com/edit/#!/cliff-peridot
https://cliff-peridot.glitch.me

I'm using Bankai here to bundle the app, what are you using? Or are you maybe using an old version of Node which doesn't support arrow functions?

@crcdng
Copy link
Author

crcdng commented Mar 21, 2019

I have remixed the starter tutorial linked from https://handbook.choo.io/your-first-choo-app/ keeping the original configuration. I just specified node version 10 just to be sure. If I copy in your code it breaks as well.

https://glitch.com/~magical-apple

https://glitch.com/edit/#!/magical-apple?path=index.js:1:0

Anything I could be missing?

@goto-bus-stop
Copy link
Member

It uses an old version of uglifyify that doesn't support arrow functions. Update to v5 and it works, see remix here: https://glitch.com/edit/#!/cedar-manuscript?path=package.json:14:0

@crcdng
Copy link
Author

crcdng commented Mar 21, 2019

Confirmed. Thanks a lot. @tornqvist that should be updated in the
https://glitch.com/edit/#!/project/choo-animals-starter as well.

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

3 participants