tailwindlabs/tailwindcss-jit

postcss-nested @tailwind utilities, with postcss watcher, causes duplicate nesting on each update

eminos opened this issue · 2 comments

What version of @tailwindcss/jit are you using?

v0.1.3

What version of Node.js are you using?

v14.15.4

What browser are you using?

N/A

What operating system are you using?

Windows

Reproduction repository

https://www.youtube.com/watch?v=uGsf_ovOxJY

postcss.config.js

module.exports = {
    plugins: {
        'postcss-nested': {}, // I also tried putting this after tailwind
        '@tailwindcss/jit': {},
        autoprefixer: {},
    }
}

src/style.css

.my-class {
    @tailwind utilities;
}

Running the build-in postcss watcher.
After each template file change the class .my-class is added to the nest.

dist/style.css

.my-class .my-class .ml-3 {
margin-left: 0.75rem
}

Tailwind config is default, just set purge to watch one file.
Without nesting @tailwind utilities it works fine.
Reloading the watcher fixes it, until the watcher picks up another change.

test

I tested it now with @tailwindcss/jit@0.1.7 and this issue is solved.