"Error: 'target' is a required option" when running imported function from `<script context="module">`

Question

我有一个 Error.svelte 组件，它有一个 <script context="module"> 包含一个可写存储和一个导出的 'addError' 函数，改变存储内容。

Error.svelte

<script context="module">

    import {get, writable} from "svelte/store";

    let errorStore = writable([])

    export function addError(error) {
        let errors = get(errorStore)
        errors.push(error)
        errorStore.set(errors)
        throw error
    }
</script>

App.svelte

<script>
    import Error, {addError} from './Error.svelte'
    import DifferentComp from './DifferentComp.svelte'  
</script>

<Error />

<button on:click={() => addError(new Error('error message'))}>
    addError() from App
</button>

<DifferentComp />

DifferentComp .svelte

<script>
import {addError} from './Error.svelte'

</script>

<button on:click={() => addError(new Error('error message'))}>
    addError() from DifferentComp
</button>

当从组件中导入和 运行 这个函数工作正常，但是从 App.svelte 我收到错误消息“错误：'target' 是一个必需的选项”

请参阅 this REPL 观看现场演示

从 App.svelte 导入与从另一个组件导入时是否存在差异并且存在错误原因，或者这仅仅是一个错误？

Answer 1

问题在于，在您的 App.svelte 中，您正在使用导入的 Error svelte 组件隐藏全局 Error 构造函数。在 DifferentComp new Error() 中表示“创建错误”，而在 App.svelte 中表示“创建错误组件的实例”。将默认导入重命名为其他名称并且它有效。