Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

312
Visualizações
A component can only have one instance-level <script> element

I'm trying to include svelte material ui to my sveltekit app. I get the error:

svelte error log

Here is a sample of my code:

<script context="module" lang="ts">
    export const prerender = true;
</script>

<script lang="ts">
    import Counter from '$lib/Counter.svelte';
</script>

<script lang="ts">
    import Button, { Label } from '@smui/button';
   
    let clicked = 0;
  </script>


<svelte:head>
    <title>Home</title>
</svelte:head>

<section>
    <h1>
        <div class="welcome">
            <picture>
                <source srcset="svelte-welcome.webp" type="image/webp" />
                <img src="svelte-welcome.png" alt="Welcome" />
            </picture>
        </div>

        to your new<br />Svelte 
        <Button variant="raised">
            aaaaaaa
          </Button>
    </h1>

    <h2>
        try editing <strong>src/routes/index.svelte</strong>
    </h2>

    <Counter />
</section>

What's happening? What am I missing? There is this thread on the issue on github but I can't seem to find it useful. I'll be happy if someone could explain exactly what is happening here. Thanks!

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

It's because you have two script tags in your component. It should have only one.

<script context="module" lang="ts">
    export const prerender = true;
</script>

<script lang="ts">
    import Counter from '$lib/Counter.svelte';
    import Button, { Label } from '@smui/button';
   
    let clicked = 0;
  </script>


<svelte:head>
    <title>Home</title>
</svelte:head>

<section>
    <h1>
        <div class="welcome">
            <picture>
                <source srcset="svelte-welcome.webp" type="image/webp" />
                <img src="svelte-welcome.png" alt="Welcome" />
            </picture>
        </div>

        to your new<br />Svelte 
        <Button variant="raised">
            aaaaaaa
          </Button>
    </h1>

    <h2>
        try editing <strong>src/routes/index.svelte</strong>
    </h2>

    <Counter />
</section>
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda