Svelte 库 [Ckeditor 5] 作为节点模块工作，但不在本地工作答案

【问题标题】：Svelte Library [Ckeditor 5] works as node module but not locallySvelte 库 [Ckeditor 5] 作为节点模块工作，但不在本地工作
【发布时间】：2021-11-19 11:05:46
【问题描述】：

我正在尝试将 Ckeditor5 添加到 Sveltekit。

使用节点模块效果很好。我导入库onMount 并使用它。

// Works flawlessly
<script>
  import { onMount } from 'svelte';

  let Editor;
  onMount(async () => {
    const module = await import('@ckeditor/ckeditor5-build-balloon-block');
    Editor = module.default;
    Editor.create(document.querySelector('#editor'), {}).then((editor) => {
      console.log(editor);
    });
  });
</script>

但是，如果我尝试导入本地构建，module.default 始终是undefined。即使我只是复制 node_module，也会发生同样的情况。

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

  let Editor;
  onMount(async () => {
    // Import changed to local build
    const module = await import('src/lib/ckeditor');
    Editor = module.default;
    Editor.create(document.querySelector('#editor'), {}).then((editor) => {
      console.log(editor);
    });
  });
</script>

还值得注意的是，记录本地模块只会打印： Module {Symbol(Symbol.toStringTag): 'Module'} 到控制台。

【问题讨论】：

标签： ckeditor svelte ckeditor5 vite sveltekit

【解决方案1】：

你能分享你的 /src/lib/ckeditor 文件内容吗？

旁注。访问 DOM 元素时，您可以执行以下操作，而不是使用 document.querySelector

<script>
 let editorEl;
 onMount(()=>{
    Editor.create(editorEl, {})
 })
</script>

<div bind:this={editorEl}></div>

【讨论】：

这是一个被导入的 ckeditor.js 文件。即使我使用包结构，行为也不会改变。