Javascript '；无法读取属性'；帆布'；未定义的'；将wavesurfer.js与Ember.js一起使用时

我目前正在尝试实现一个Ember.js组件。到目前为止，我已将其导入我的

ember cli build.js

文件，如下所示：

app.import('bower_components/wavesurfer.js/dist/wavesurfer.min.js');

然后在组件的js文件中，我试图通过在助手模板中包含的div上调用它来对其进行简单测试

import Ember from 'ember';

export default Ember.Component.extend({
    didRender() {
        var wavesurfer = WaveSurfer.create({
            container: '#waveform',
            waveColor: 'violet',
            progressColor: 'purple',
            barWidth: 3,
            cursorWidth: 3,
            normalize: true
        });
        wavesurfer.load('assets/sound4.mp3');
    }
});

现在，当页面加载时，会显示wavesurfer.js滚动条，但不会显示其他内容。在控制台中，它读取

无法读取未定义的属性“canvas”

它似乎在wavesurfer.js的

2048行出现错误，错误如下：

entry.start = (entry.waveCtx.canvas.offsetLeft / totalWidth) || 0;


Uncaught TypeError: Cannot read property 'canvas' of undefined

如果有任何帮助，我将不胜感激，因为我完全无法确定应该做什么。
试试1.3.1或更高版本。你可能有兴趣看看这个@kumkanillam谢谢，我还没有找到讨论。我刚试过1.3.4和1.3.1，但运气不好，一路滚回1.2.8的效果！