title: React Dragula giving "Failed to compile" and "unexpected" error
body: <p>I've been trying to implement React Dragula (link: <a href="https://github.com/bevacqua/react-dragula" rel="nofollow noreferrer">https://github.com/bevacqua/react-dragula</a>) and keep coming up with an error because I'm sure my syntax is incorrect.  Can someone let me know what I'm doing wrong here?</p>
  
  <p>All I'm trying to do is make the <code>&lt;div&gt;</code> below to become a sortable drag and drop list (this proves to be a lot harder than I'd hoped).  React DND is an option however I've run into a fair amount of issues and this appears to be a little more simpler.</p>
  
  <pre><code>import React, { Component } from 'react';
  import PropTypes from 'prop-types';
  import {Icon} from 'react-fa';
  import { Row, Col } from 'react-flexbox-grid';
  import styled from 'styled-components';
  import Dragula from 'react-dragula';
  
  const style = {
    cursor: 'move',
  };
  
  
  const CountCell = styled.div`
    border: 1px solid #5C57B1;
    background: #6E68C5
    width: 320px;
    display: flex;
    justify-content: center;
    height: 50px;
    align-items: center;
  `
  
  const Score = styled.span`
    color: #74D8FF;
    font-size: 26px;
    font-weight: bold;
    padding: 0 0.5em;
    display: inline-block;
    width: 30px;
    text-align: center;
  `
  const ScoreName = styled.span`
    color: white;
    font-size: 20px;
    padding: 0 0.5em;
    display: inline-block;
    width: 160px;
    text-align: center;
  `
  
  const CountButton = styled.button`
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background: #6E68C5;
    height: 30px;
    border: 0;
    border-radius: 50px;
    border: 3px solid white;
    width: 30px;
    transition: all 250ms;
    &amp;:focus {outline:0;}
    &amp;:hover {background: white;}
  `
  
  class Counter extends Component {
  
    incrementCount(e) {
      // I need to update the current state's count, and add 1 to it.
      this.setState({
        count: (this.state.count + 1),
      })
    }
  
    decrementCount(e) {
      this.setState({
        count: (this.state.count - 1),
      })
    }
  
  
    render() {
      const { count } = this.props
      const { decrementCount } = this.props
      const { incrementCount } = this.props
      const { nameof } = this.props
      const { text, isDragging, connectDragSource, connectDropTarget } = this.props;
      const opacity = isDragging ? 0 : 1;
      return (
        &lt;div className='container' style={{ ...style, opacity }} ref={this.dragulaDecorator}&gt;
            &lt;CountCell&gt;
              &lt;Row style={{alignItems: 'center'}}&gt;
                &lt;Col&gt;
                  &lt;CountButton
                    onClick={incrementCount}&gt;
                    &lt;Icon
                      name="icon" className="fa fa-plus score-icon"
                    /&gt;
                  &lt;/CountButton&gt;
                &lt;/Col&gt;
                &lt;Col &gt;
                  &lt;ScoreName&gt;{nameof}&lt;/ScoreName&gt;
                &lt;/Col&gt;
                &lt;Col &gt;
                  &lt;Score&gt;{count}&lt;/Score&gt;
                &lt;/Col&gt;
                &lt;Col&gt;
                  &lt;CountButton
                    onClick={decrementCount}&gt;
                    &lt;Icon
                    name="icon" className="fa fa-minus score-icon"
                    /&gt;
                  &lt;/CountButton&gt;
                &lt;/Col&gt;
              &lt;/Row&gt;
            &lt;/CountCell&gt;
          &lt;/div&gt;
        )
      }
    }
  
  Counter.propTypes = {
    // We are going to _require_ a prop called "count". It _has_ to be a Number.
    count: PropTypes.number.isRequired,
  
    // We are going to _require_ a prop called "incrementCount". It _has_ to be a Function.
    incrementCount: PropTypes.func.isRequired,
  
    // We are going to _require_ a prop called "decrementCount". It _has_ to be a Function.
    decrementCount: PropTypes.func.isRequired,
  
    nameof: PropTypes.string.isRequired,
  },
  componentDidMount: function () {
    var container = React.findDOMNode(this);
    dragula([container]);
  }
  });
  
  export default Counter
  </code></pre>
  
  <p>The error I get is:</p>
  
  <pre><code>./src/components/pages/projectpages/dnd2/Counter.js
  Syntax error: Unexpected token, expected ; (127:17)
  
    125 |   nameof: PropTypes.string.isRequired,
    126 | },
  &gt; 127 | componentDidMount: function () {
        |                  ^
    128 |   var container = React.findDOMNode(this);
    129 |   dragula([container]);
    130 | }
  </code></pre>