withastro / prettier-plugin-astro

Prettier plugin for Astro
Other
479 stars 36 forks source link

🐛 BUG: prettier-ignore destroys the contents #338

Open hyvyys opened 1 year ago

hyvyys commented 1 year ago

Describe the Bug

Before save:

obraz

After save:

obraz

Code:

              <!-- prettier-ignore -->
              <div
                class:list={[
                  sizeLogo,
                  'mb-[-.24em] font-display font-black text-[var(--color-logo)] logo leading-1.2 light ---text-fg',
                ]}
              >
              {
                font.name.split('').map((char, i) => <span class="char" style={{ '--i': i }}>{char}</span>)
              }
              </div>

Steps to Reproduce

  1. npm init astro using default template
  2. Add prettier-plugin-astro and prettier-plugin-tailwindcss
  3. Format contents as above
  4. Error! Code gets swallowed into oblivion
ony3000 commented 7 months ago

I think this issue may be related to #411.

When I applied Prettier to the following code, the beginning of the second prettier-ignore comment disappeared.

<!-- prettier-ignore -->
<script>
if (condition1) {
  foo
} else if (condition2) {
  bar
}
else
{
  baz
}
</script>

<!-- prettier-ignore -->
<script>
if (condition1) {
  foo
} else if (condition2) {
  bar
}
else
{
  baz
}
</script>
Kobreros commented 2 months ago

I have the same bug, which makes using prettier-ignore impossible in some files. Especially annoying when inserting svg.

Before

<!-- prettier-ignore -->
<a href="" class="btn btn--primary">Get your free proposal</a>
<!-- prettier-ignore -->
<Image class="cta__image" src={CtaImg} alt="" />

After

<!-- prettier-ignore -->
 href="" class="btn btn--primary">Get your free proposal</a>

<!-- prettier-ignore -->
mage cla
Bvngee commented 1 month ago

Same issue here - at least I think. Correct me if Im wrong.

Before

<!-- prettier-ignore -->
<nav id="nav-links">
    <a id="home" href="/"><span class="icon" id="home-logo"> </span>Home</a>
    <a id="about" href="/about/"><span class="icon" id="about-logo"> </span>About</a>
    <a id="blog" href="/blogs/"><span class="icon" id="blog-logo">󱀂 </span>Blogs</a>
</nav>

<style>
    #nav-links {
        height: 50px;
...

After

<!-- prettier-ignore -->
<nav id="nav-links">
    <a id="home" href="/"><span class="icon" id="home-logo"> </span>Home</a>
    <a id="about" href="/about/"><span class="icon" id="about-logo"> </span>About</a>
    <a id="blog" href="/blogs/"><span class="icon" id="blog-logo">󱀂 </span>Blogs</a>
</nav>

<sty

<style>
    #nav-links {
        height: 50px;
...