Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Pug templates fail if the first line has indentation

See original GitHub issue

Describe the bug

Pug templates fail if the first line has indentation, meaning, this works :

<template lang=pug>
div
    span
</template>

and this doesn’t

<template lang=pug>
    div
        span
</template>

(the error is unexpected token indent)

Is it possible to allow users to make the choice they prefer ? It made my webpack->vite migration a chore 😃

(reproduction : just install pug and try an SFC with lang=“pug”)

Reproduction

stackblitz

System Info

System:
    OS: macOS 12.3
    CPU: (8) x64 Apple M1
    Memory: 48.59 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.16.1 - /usr/local/bin/node
    npm: 7.20.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 100.0.4896.60
    Firefox: 95.0.1
    Safari: 15.4

Used Package Manager

npm

Logs

No response

Validations

Follow our Code of Conduct
Read the Contributing Guidelines.
Read the docs.
Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
The provided reproduction is a minimal reproducible example of the bug.

Issue Analytics

State:
Created a year ago
Reactions:1
Comments:9 (6 by maintainers)

Top GitHub Comments

2reactions

bluwycommented, Apr 3, 2022

I can’t find how build a pen with SFC and pug 😕

You can duplicate your setup in a stackblitz project, which should work too

1reaction

patak-devcommented, May 16, 2022

Closing, as @sodatea said, this should be solved upstream. There is nothing actionable in core in this issue

Top Results From Across the Web

How to fix Invalid Indentation error in pug? - Stack Overflow

Another possible problem is that you have a "tab" at the end of the line, behind "form" or behind "body". – Sergi Nadal....

pug/jade: unexpected token: indent (Example) - Treehouse

First off, when I created my layout.pug and transferred the appropriate text into it, it said that it had inconsistent spacing, ...

vue/html-indent

This rule enforces a consistent indentation style in <template> . The default style is 2 spaces. This rule checks all tags, also all...

Vue.js | WebStorm Documentation - JetBrains

By default, only the code inside template tags has initial indentation. If necessary, add other tags using commas as separators. For example, if ......

Template primer - Learn web development | MDN

Note: The downside of using Pug is that it is sensitive to indentation and whitespace (if you add an extra space in the...