1

我对 Svelte 相当陌生(我使用的是版本 2,直到 3 版正确发布),我正在构建一个旨在进行一些音频分析 (FFT) 的站点。因此,我将古老的 ToneJS 库 ( http://tonejs.github.io/ ) 合并到我的一个组件中。

出于某种原因,仅仅导入 ToneJS 就足以让整个应用程序崩溃。

这是我的 Svelte 组件的全部内容:

<h2>Pitch analyser</h2>


<script>
    import Tone from 'tone';

</script>

这会导致错误:

Tone.js:7 Uncaught TypeError: Cannot assign to read only property 'listener' of object '#<AudioContext>'
at t.Context.set (Tone.js:7)
at t.Listener.<anonymous> (Tone.js:7)
at Function.e.getContext (Tone.js:7)
at new t.Listener (Tone.js:7)
at Object.<anonymous> (Tone.js:7)
at Object.<anonymous> (Tone.js:7)
at i (Tone.js:1)
at Object.<anonymous> (Tone.js:7)
at i (Tone.js:1)
at Tone.js:1

这可能不是 Svelte 特有的,但我已经在许多其他项目(包括 React 内部等)中成功使用了 Tone JS,没有遇到任何问题。

这可能是什么原因造成的?以及如何在我的 Svelte 应用程序中开始使用 ToneJS?(使用 Rollup 打包/转译)

4

2 回答 2

3

发生这种情况是因为 Rollup 作为原生 JavaScript 模块打包器,必须将所有 JS 视为处于严格模式(因为 JavaScript 模块始终是严格的),即使它们是从旧格式转换而来的。

不幸的是 Tone.js 正在做违反严格模式的事情(分配给不可写的属性)。我建议在该回购上提出问题;严格模式更快、更安全,确实没有理由支持严格模式环境。

同时,您可以通过将 Tone.js 包含为常规<script>标记并将其作为全局标记在您的应用程序中引用来解决它。

于 2019-03-07T15:31:23.497 回答
0

把这intro:条线rollup.config.js给我修好了:

output: {
    sourcemap: true,
    format: 'iife',
    name: 'app',
    file: 'public/bundle.js',
    // Added this line:
    intro: 'var global = typeof self !== undefined ? self : this;'
},
于 2019-08-30T04:10:05.717 回答