Failed to compile.

[wulingmei]

iimport React from 'react';
import ReactAplayer from 'react-aplayer';

export default class MusicPlyer extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  playHandler() {
    console.log('on play');
  }

  pauseHandler() {
    console.log('on pause');
  }

  render() {
    const props = {
      "autoplay": true,
      "mutex": true,
      "preload": "metadata",
      "music": {
        "author": "Hans Zimmer/Richard Harvey",
        "url": "http://devtest.qiniudn.com/Preparation.mp3",
        "pic": "http://devtest.qiniudn.com/Preparation.jpg"
      }
    };

    return (
      <ReactAplayer {...props} onPlay={this.playHandler} onPause={this.pauseHandler}/>
    );
  }
}

Failed to compile.

./~/react-aplayer/src/react-aplayer.js
Module parse failed: /Users/zhangwei/Work/Github/wulingmei/node_modules/react-aplayer/src/react-aplayer.js Unexpected token (20:6)
You may need an appropriate loader to handle this file type.
|   render() {
|     return (
|       <div className="aplayer" ref={(el) => {
|         this.el = el;
|       }}></div>

[sabrinaluo]

What's your webpack version and your webpack config?

Do you have below config in your .babelrc file?

{
  "presets": ["es2015", "react"]
}

Do you have babel-preset-es2015, babel-preset-react installed as project devDependencies?

If you are creating a new APP, a quick solution would be to create your react app with https://github.com/facebookincubator/create-react-app

[wulingmei]

我使用的就是create-react-app呢，

[sabrinaluo]

Should be fixed now, please update the version by running:

npm install react-aplayer

Let me know if there is still any issue, thanks. :)