custom-element - 未捕获( promise )TypeError : Illegal constructor at new SvelteElement (index. mjs:1381)

Question

Uncaught promise when registering a custom element using the latest sapper, svelte, nodeJS, and rollup stack using the following statements.

REPL 示例 :https://svelte.dev/repl/489ee8acd10848b0bb1feb2535bd6cc5?version=3.16.5本地创建

<svelte:options tag="parlax-background" />
    & rollup.config.js
    export default {
    client: {
    input: config.client.input(),
    output: config.client.output(),
    plugins: [
    replace({...})
    svelte({
    dev: !production,
    customElement: true,
    // and tried also with customElement: { tag: "my-element"}
    hydratable: true,
    emitCss: true

我想提一下，我已经在一个新项目上进行了测试

日志

[Client Side]
    => Uncaught (in promise) TypeError: Illegal constructor
    at new SvelteElement (index.mjs:1381)
    [Server Side]
    => The 'tag' option is used when generating a custom element. Did you forget the 'customElement: true' compile option?
    44: <svelte:options tag="my-element" />

1. 当我注册 [ ** customElement: true ] 在我得到的配置中**

2. 如果我没有在配置中注册我的元素，我不会收到任何错误，但我的元素都没有注册 :(

引用: https://github.com/sveltejs/svelte/issues/4132

Answer 1

如引用 GitHub issue 中所述, 一旦您使用 customElements: true 配置 Svelte 编译器，您需要为 提供元素标签全部 您的组件(使用 <svelte:options tag="my-component"/> 。

在您的 REPL 示例中，这意味着更新 App.svelte与例如<svelte:options tag="my-app"/>
当您现在运行该应用程序时，您不应再在控制台中看到错误，而是一个正在运行的应用程序。