Is there a way to get Pug templates working?

According to the Vite github issues, it should just require

pug

pug

to be installed. I've done that but VsCode seems to be formatting

pug

pug

markup incorrectly.
Pug is an indent-senstive format but it's taking this:

<ApplicationShell bind:elementRoot>
  .flexcol
    DocInput(attr={"name"})
    textarea(bind:value={$documentStore.system.description})
    textarea(bind:value={$documentStore.system.lore})
</ApplicationShell>

<ApplicationShell bind:elementRoot>
  .flexcol
    DocInput(attr={"name"})
    textarea(bind:value={$documentStore.system.description})
    textarea(bind:value={$documentStore.system.lore})
</ApplicationShell>

and converting it to this

<ApplicationShell bind:elementRoot>
  .flexcol DocInput(attr={"name"}) textarea(bind:value={$documentStore.system.description}) textarea(bind:value={$documentStore
    .system.lore})
</ApplicationShell>

<ApplicationShell bind:elementRoot>
  .flexcol DocInput(attr={"name"}) textarea(bind:value={$documentStore.system.description}) textarea(bind:value={$documentStore
    .system.lore})
</ApplicationShell>

... which is annoying and broken. Any thoughts?
It seems to be the

Svelte for VsCode

Svelte for VsCode

plugin that is doing this mal-formatting.

However, even if I disable it, the build does not seem to work with pug templates... it renders them as plaintext

TyphonJS•4y ago•

6 replies

geoidesic [Aardvark Games]

Is there a way to get Pug templates working?

According to the Vite github issues, it should just require

pug

pug

to be installed. I've done that but VsCode seems to be formatting

pug

pug

markup incorrectly.
Pug is an indent-senstive format but it's taking this:

<ApplicationShell bind:elementRoot>
  .flexcol
    DocInput(attr={"name"})
    textarea(bind:value={$documentStore.system.description})
    textarea(bind:value={$documentStore.system.lore})
</ApplicationShell>

<ApplicationShell bind:elementRoot>
  .flexcol
    DocInput(attr={"name"})
    textarea(bind:value={$documentStore.system.description})
    textarea(bind:value={$documentStore.system.lore})
</ApplicationShell>

and converting it to this

<ApplicationShell bind:elementRoot>
  .flexcol DocInput(attr={"name"}) textarea(bind:value={$documentStore.system.description}) textarea(bind:value={$documentStore
    .system.lore})
</ApplicationShell>

<ApplicationShell bind:elementRoot>
  .flexcol DocInput(attr={"name"}) textarea(bind:value={$documentStore.system.description}) textarea(bind:value={$documentStore
    .system.lore})
</ApplicationShell>

... which is annoying and broken. Any thoughts?
It seems to be the

Svelte for VsCode

Svelte for VsCode

plugin that is doing this mal-formatting.

However, even if I disable it, the build does not seem to work with pug templates... it renders them as plaintext

Is there a way to get Pug templates working?

Similar Threads

Is there a way to get Pug templates working?

Similar Threads

Similar Threads

Similar Threads