Pug 和 Svelte 每次迭代都不起作用答案

【问题标题】：Pug and Svelte each iteration not workingPug 和 Svelte 每次迭代都不起作用
【发布时间】：2021-08-23 17:46:39
【问题描述】：

直接来自教程，但只是使用 pug 作为模板引擎。 https://svelte.dev/tutorial/each-blocks 有没有人有经验或者可以指出我在哈巴狗中使用苗条表达式的方向。

<script lang="ts">
    let cats = [
        { id: "J---aiyznGQ", name: "Keyboard Cat" },
        { id: "z_AbfPXTKms", name: "Maru" },
        { id: "OUtn3pvWmpg", name: "Henri The Existential Cat" },
    ];
</script>

<template lang="pug">
    {#each cats as cat}
        p {cat.name}
    {/each}
</template>

<style lang="scss">
</style>

错误

[!] (plugin svelte) Error: src/components/Ribbon.svelte:43:1
    41|   | {@debug !{variables}}
    42| 
  > 43| {#each cats as cat}
--------^
    44|     p {cat.name}
    45| {/each}
    46| 

unexpected text "{#eac"

【问题讨论】：

标签： pug svelte

【解决方案1】：

一些 Svelte 语法是无效的 pug，这就是它稍微改变的原因。我猜你正在使用svelte-preprocess，如果不是我建议使用它进行预处理。

文档有关于有效语法的信息：https://github.com/sveltejs/svelte-preprocess/blob/main/docs/preprocessing.md#pug

    +each('cats as cat')
        p {cat.name}

【讨论】：