svelte - ReferenceError : document is not defined in Svelte 3

Question

我正在尝试在<script>中手动document.createElement，然后在每次调用appendChild替换它时，先在audio中添加eventListener。 一切都可以在浏览器中正常运行，除了页面加载时会出现的非常快速的错误，但这持续时间不到100ms 。终端中也有错误

ReferenceError: document is not defined
    at Object (webpack:///./src/components/Record/Component.svelte?:26:17)

似乎在文档还没有准备好但后来还可以的时候调用了上面的方法，该如何解决？或者在Svelte world(Sapper)中销毁和重新创建组件的首选方法是什么？

Answer 1

document尚未在服务器上定义，因此您需要在组件中对此加以防范，以使特定的代码段仅在浏览器中运行。

您可以使用仅在呈现组件后才在浏览器中运行的 onMount 函数。

<script>
  import { onMount } from 'svelte';

  onMount(() => {
    document.createElement(...);

    // ...
  });
</script>