React howler - 无法加载核心功能答案

【问题标题】：React howler - unable to load core functionReact howler - 无法加载核心功能
【发布时间】：2017-02-15 16:06:31
【问题描述】：

我正在使用React-Howler 在我的 React 应用程序中播放声音。在我的组件顶部，我有以下导入：

import ReactHowler from 'react-howler';
import React, {Component} from 'react';

class SamplesInnerLrg extends Component { 

playSampleAction(sampleSource) {

    var sound = new Howl({
      src: [sampleSource]
    })

}
render() {
    <div>
        <div onClick={this.playSampleAction("url to some source")}>Play</div>
        <ReactHowler src={"url to some source"} playing={true} />
    </div>

}

当我渲染组件时，它会播放来自组件的声音，但是当我单击 div 说“播放”时，它告诉我没有定义嚎叫。我尝试用 2 种方式定义嚎叫：

var Howl = require('howler').Howl;

或

import { Howl } from 'react-howler'

但两者都不起作用。不知道我在导入 Howl 时做错了什么！

【问题讨论】：

标签： reactjs howler.js

【解决方案1】：

确保在浏览器中包含 Howler 脚本：

<script src="/path/to/howler.js"></script>
<script>
    var sound = new Howl({
      src: ['sound.webm', 'sound.mp3']
    });
</script>

【讨论】：