reactjs - meteor-react -Missing class properties transform -
i trying implement react-dnd in meteor react project.
i getting error this: errors prevented startup:
while processing files ecmascript (for target web.browser): client/card.js:37:2: /client/card.js: missing class properties transform.
card.js file: import react, { component, proptypes } 'react'; import itemtypes './itemtypes'; import { dragsource, droptarget } 'react-dnd'; const style = { border: '1px dashed gray', padding: '0.5rem 1rem', marginbottom: '.5rem', backgroundcolor: 'white', cursor: 'move' }; const cardsource = { begindrag(props) { return { id: props.id }; } }; const cardtarget = { hover(props, monitor) { const draggedid = monitor.getitem().id; if (draggedid !== props.id) { props.movecard(draggedid, props.id); } } }; @droptarget(itemtypes.card, cardtarget, connect => ({ connectdroptarget: connect.droptarget() })) @dragsource(itemtypes.card, cardsource, (connect, monitor) => ({ connectdragsource: connect.dragsource(), isdragging: monitor.isdragging() })) export default class card extends component { static proptypes = { connectdragsource: proptypes.func.isrequired, connectdroptarget: proptypes.func.isrequired, isdragging: proptypes.bool.isrequired, id: proptypes.any.isrequired, text: proptypes.string.isrequired, movecard: proptypes.func.isrequired }; render() { const { text, isdragging, connectdragsource, connectdroptarget } = this.props; const opacity = isdragging ? 0 : 1; return connectdragsource(connectdroptarget( <div style={{ ...style, opacity }}> {text} </div> )); } } package.json file: { "name": "meteorexample", "private": true, "scripts": { "start": "meteor run" }, "dependencies": { "material-ui": "^0.15.4", "meteor-node-stubs": "~0.2.0", "react": "^15.0.1", "react-addons-pure-render-mixin": "^15.3.2", "react-dnd": "~2.1.4", "react-dnd-html5-backend": "~2.1.2", "react-dom": "^15.3.2", "react-router": "^2.3.0", "react-tap-event-plugin": "^1.0.0", "babel-plugin-react-transform": "~2.0.2", "babel-plugin-transform-class-properties": "~6.11.5", "babel-register": "~6.14.0" }, "devdependencies": { "babel-preset-stage-0": "~6.5.0" } }
meteor not support static default, can add it:
meteor npm install --save-dev babel-plugin-transform-class-properties
edit package.json in project , add there following make the package work:
"babel": { "plugins": ["transform-class-properties"] }
Comments
Post a Comment