CODEWITHSUNDEEP
javascriptreactjsdrag-and-dropreact-dnd
Flip
Flip

Reputation: 133

Reactjs - Drag and Drop (react-dnd) troubleshot

I have reactjs test project coded like this.

    import React, { Component, PropTypes } from 'react';
    import { DragDropContext } from 'react-dnd';
    import HTML5Backend from 'react-dnd-html5-backend';

    import Square from './Square';
    import Knight from './Knight';
    import { moveKnight } from './Game';
    import { canMoveKnight, moveKnight } from './Game';

    @DragDropContext(HTML5Backend)
.....

But when I run code, I got following error.

Failed to compile.

Error in ./src/Board.js
Syntax error: Unexpected token (11:0)

   9 | import { canMoveKnight, moveKnight } from './Game';
  10 | 
> 11 | @DragDropContext(HTML5Backend)
     | ^
  12 | 
  13 | export default class Board extends Component {
  14 |   static propTypes = {

 @ ./src/index.js 16:13-31

If you have rich experience about react-dnd and react-dnd-html5-backend, Please help me to solve this issue. Thanks.

Upvotes: 2

Views: 1384

Answers (1)

m1kael
m1kael

Reputation: 2851

Looks like your decorators are not being processed by Babel (you're using Babel/Webpack, I'm assuming). You need to install the babel-plugin-transform-decorators plugin, or babel-plugin-transform-decorators-legacy if you need the old behavior.

Upvotes: 1

Related Questions