jiwenjiang/react-audio-analyser

react antd 下运行报错

Closed this issue · 1 comments

image

按照readME 里面的做法
npm install react-audio-analyser --save
拷贝demo
运行npm run start 出现上图的错误。 这是怎么回事?

完整的demo代码:
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import { DatePicker } from 'antd';

import AudioAnalyser from "react-audio-analyser";

export default class Demo extends Component {
constructor(props) {
super(props)
this.state = {
status: null
}
}

controlAudio(status) {
    this.setState({
        status
    })
}

render() {
    const {status, audioSrc} = this.state;
    const audioProps = {
        audioType: "audio/wav", // supported audio/wav,audio/mp3, default audio/webm
        status, // Triggering component updates by changing status
        audioSrc,
        startCallback: (e) => {
            console.log("succ start", e)
        },
        pauseCallback: (e) => {
            console.log("succ pause", e)
        },
        stopCallback: (e) => {
            this.setState({
                audioSrc: window.URL.createObjectURL(e)
            })
            console.log("succ stop", e)
        }
    }
    return (
        <AudioAnalyser {...audioProps}>
            <div className="btn-box">
                {status !== "recording" &&
                <i className="iconfont icon-start" title="开始"
                   onClick={() => this.controlAudio("recording")}></i>}
                {status === "recording" &&
                <i className="iconfont icon-pause" title="暂停"
                   onClick={() => this.controlAudio("paused")}></i>}
                <i className="iconfont icon-stop" title="停止"
                   onClick={() => this.controlAudio("inactive")}></i>
            </div>
        </AudioAnalyser>
    );
}

}

function App() {
return (
<div style={{ margin: 100 }}>

AntDesign Demo







);
}

ReactDOM.render(, document.getElementById('root'));

我自己测试是在create-react-app上做的。你这个我回去看一下吧。
看了下截图,你是不是没css-loader呢