Nicolas Alejo
Nicolas Alejo

Reputation: 81

JSX/JavaScript syntax in Chrome

This is really silly but i got a problem with Chrome (works fine in Firefox) with this syntax borrowed from an example in react-dnd component (link: https://github.com/gaearon/react-dnd/blob/master/examples/_dustbin-simple/Dustbin.js).

const itemDropTarget = {
    acceptDrop(component, item) {
        component.setItem(item);
    }
};

It trigger this error:

Uncaught SyntaxError: Unexpected token (

Chrome doesn't like this either:

const DustbinSimple = React.createClass({
    render() {

It must be:

const DustbinSimple = React.createClass({
    render: function() {

What am i missing? Must be something really basic i don't understand.

Thanks in advance.

Upvotes: 1

Views: 3615

Answers (3)

Hafiz Arsam Rahmaan
Hafiz Arsam Rahmaan

Reputation: 37

you can add parcel bundler to your project.It will automatically transform your code so the browser can understand

Upvotes: 0

Nicolas Alejo
Nicolas Alejo

Reputation: 81

I found what the problem was... I needed to compile JSX code using --harmony flag with reactify/browserify:

...
bundler.transform(["reactify", {"harmony": true}]);
...

Upvotes: 2

Mike Cluck
Mike Cluck

Reputation: 32511

JSX is an extension to Javascript. To actually run it in the browser, you must run it through the JSX Transformer.

Upvotes: 2

Related Questions