Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Oxide] Add built-in @import processing support #11239

Merged
merged 8 commits into from
May 15, 2023

Conversation

RobinMalfait
Copy link
Contributor

@RobinMalfait RobinMalfait commented May 15, 2023

This PR adds built-in support for processing and inlining @import at-rules, in a way that is compatible with Tailwind's @config and @tailwind directives.

This removes the need for installing and configuring postcss-import, but won't cause any issues in projects that already have it set up.

The advantage to using the built-in support provided by this PR is that it will let you place your @config and @tailwind directives anywhere in your CSS file you like, whereas using postcss-import directly forces you to put all of your @import statements before your @config and @tailwind directives.

@config "./admin/tailwind.config.js";

@tailwind base;
@import "./my-base.css";

@tailwind utilities;
@import "./my-utilities.css";

@tailwind components;
@import "./my-components.css";

@import "third-party/library.css";

Under the hood we are still using postcss-import to handle the actual inlining of the @import at-rules, but our intention is for this to be an implementation detail and we may migrate to another tool or something custom in the future.

The PostCSS `from` was always set to the `tests/util/run` file with the
current test name as a query param to make it unique. However, that
results in issues with relative file paths because they are now relative
to this file instead of the actual test file.

Luckily, `expect.getState()` exposes the `testPath` value that points to
the current test file itself.
+ additional features such that you can use `@tailwind` and `@config`
  directives before the `@import` at rule which isn't normally allowed.
  However "@tailwind" in a way is an `@import` and `@config` in a way is
  a `@charset` which can be used before the `@import` at rule.
This will now be handled by Tailwind from a higher level, so the core
doesn't have to worry about normalizing this anymore since it will
always be normalized right now.
@RobinMalfait RobinMalfait force-pushed the feat/built-in-import-processing branch from 7f44ca1 to 0a641dd Compare May 15, 2023 17:01
@RobinMalfait RobinMalfait changed the title Add built-in @import processing support [Oxide] Add built-in @import processing support May 15, 2023
We don't need the `startsWith` check anymore because the contents of the
comment will be the actual value we expect.
@RobinMalfait RobinMalfait merged commit f49b054 into master May 15, 2023
21 checks passed
@RobinMalfait RobinMalfait deleted the feat/built-in-import-processing branch May 15, 2023 17:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant