tailwindcss
tailwindcss copied to clipboard
PostCSS warning for custom utility used with before:/after:
What version of Tailwind CSS are you using?
3.4.3
What build tool (or framework if it abstracts the build tool) are you using?
Vite
What version of Node.js are you using?
v21.7.3
What browser are you using?
Chrome
What operating system are you using?
macOS
Reproduction URL
https://stackblitz.com/edit/vitest-dev-vitest-cp1r2y
Describe your issue
There's a PostCSS warning in the console:
A PostCSS plugin did not pass the `from` option to `postcss.parse`. This may cause imported assets to be incorrectly transformed. If you've recently added a PostCSS plugin that raised this warning, please contact the package author to fix the issue.
It starts when you define your own CSS utility and use it with the before:
or after:
.
Example:
css file:
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer utilities {
.bg-own {
background-color: red;
}
}
Usage:
<div class="before:bg-own" />