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.

Tailwind CSS doesn't get compiled in @import'ed files

See original GitHub issue

Describe the bug

TailwindCSS doesn’t get compiled if it’s inside files that are imported.

In main css file:

@import "base.css";
@import "components.css";
@import "utils.css";

in imported files:

@tailwind base;

@layer base {
  #id {
    @apply flex min-h-screen flex-col;
  }
}

Reproduce

https://github.com/SpadarShut/jest-preview-import-tw-issue

Expected behavior

CSS should be compiled

Environment (please complete the following information)

OS: macOS 12.2.1
Browser: chrome
Jest version: 27.5.1

Issue Analytics

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

Top GitHub Comments

1reaction

SpadarShutcommented, Aug 12, 2022

Thanks! I worked around it in the same way.

0reactions

github-actions[bot]commented, Sep 2, 2022

This issue has been automatically closed because we haven’t received a response from the original author 🙈. This automation helps keep the issue tracker clean from issues that are unactionable. Please reach out if you have more information for us! 💪

Top Results From Across the Web

Compiled Tailwind CSS does not include custom imported files

The problem is when I compile tailwindcss throught npx tailwindcss build tail.css -o tailwind.full.css . The custom imports are not included in ...

Using with Preprocessors - Tailwind CSS

Since your CSS doesn't have to be parsed and processed by multiple tools, your CSS will compile much quicker using only PostCSS. No...

postcss-import does not compile CSS · Issue #1049 - GitHub

I am attempting to use the @import method of using Tailwind as described in the docs. I am using Parcel Bundler to compile...

Compiled Tailwind CSS does not include custom imported ...

[Solved]-Compiled Tailwind CSS does not include custom imported files-Vue.js ... @import required to provide absolute directory. It will not compile through npx ...

Laravel 8 Jetstream - Tailwind CSS not working - Laracasts

Tailwind get installed when you install jetstream, means they add in package.json and tailwind config file, but you must run npm install to...