0

我相信我的问题的答案很简单，希望你能帮助我找出那是什么！

我已经使用meteor create --svelte project-name.

然后我添加了两个这样的包：meteor npm install --save vexflow vextab. （VexFlow 网站在这里）

然后我进去修改 App.svelte 看起来像这样：

<script>
  import { VexTab, Artist, Vex } from "vextab";
  function showMusic() {
    const Renderer = Vex.Flow.Renderer;

    // Create VexFlow Renderer from canvas element with id #boo
    const renderer = new Renderer(
      document.getElementById("music"),
      Renderer.Backends.SVG
    );

    // Initialize VexTab artist and parser.
    const artist = new Artist(10, 10, 600, { scale: 0.8 });
    const tab = new VexTab(artist);

    try {
      tab.parse("tabstave").val();
      artist.render(renderer);
    } catch (e) {
      console.error(e);
    }
  }
</script>

<div class="container">
  <button on:click={showMusic}>Show Music</button>
  <div id="music" />
</div>

代码编译，但是当我单击按钮显示音乐时，错误显示： App.svelte:4 Uncaught TypeError: Cannot read property 'Flow' of undefined，这是引用Vex.Flow.

无论我如何更改导入行，我都无法让它识别 Vex！它总是以未定义的形式出现。

我错过了什么？

笔记：

流星版本：2.4

svelte@3.27.0
├── vexflow@3.0.9
└─┬ vextab@3.0.6
  ├── lodash@4.17.21
  └── vexflow@3.0.9
4

0 回答 0