No description
Find a file
Philipp Spiess 78f5b087d4
Add @import "…" reference (#15228)
Closes #15219

This PR adds a new feature, `@import "…" reference` that can be used to
load Tailwind CSS configuration files without adding any style rules to
the CSS.

The idea is that you can use this in combination with your Tailwind CSS
root file when you need to have access to your full CSS config outside
of the main stylesheet. A common example is for Vue, Svelte, or CSS
modules:

```css
@import "./tailwind.css" reference;

.link {
  @apply underline;
}
```

Importing a file as a reference will convert all `@theme` block to be
`reference`, so no CSS variables will be emitted. Furthermore it will
strip out all custom styles from the stylesheet. Furthermore plugins
registered via `@plugin` or `@config` inside reference-mode files will
not add any content to the CSS file via `addBase()`.

## Test Plan

Added unit test for when we handle the import resolution and when
`postcss-import` does it outside of Tailwind CSS. I also changed the
Svelte and Vue integration tests to use this new syntax to ensure it
works end to end.

---------

Co-authored-by: Jordan Pittman <jordan@cryptica.me>
2024-12-03 14:15:24 +01:00
.github Add Windows ARM build in CI (#15171) 2024-11-27 11:50:34 -05:00
crates Improve performance of scanning source files (#15270) 2024-12-02 14:03:10 -05:00
integrations Add @import "…" reference (#15228) 2024-12-03 14:15:24 +01:00
packages Add @import "…" reference (#15228) 2024-12-03 14:15:24 +01:00
patches Upgrade @parcel/watcher to 2.5.0 (#14978) 2024-11-13 11:38:43 +01:00
playgrounds Update eslint 9.11.1 → 9.15.0 (minor) (#15123) 2024-11-27 11:49:43 +01:00
scripts Fix integration tests on Windows (#14824) 2024-10-30 11:26:29 +00:00
.gitignore Add test.debug to integration tests (#14133) 2024-08-08 12:02:19 +02:00
.npmrc introduce v4 codebase 2024-03-05 14:29:15 +01:00
.prettierignore Hoist oxide/crates to just crates (#13333) 2024-03-23 09:00:48 -04:00
Cargo.lock Auto source detection improvements (#14820) 2024-10-29 20:33:34 +00:00
Cargo.toml Hoist oxide/crates to just crates (#13333) 2024-03-23 09:00:48 -04:00
CHANGELOG.md Add @import "…" reference (#15228) 2024-12-03 14:15:24 +01:00
LICENSE Add README, LICENSE, and CONTRIBUTING (#13088) 2024-03-05 14:45:39 -05:00
package.json Update @playwright/test 1.48.2 → 1.49.0 (minor) (#15178) 2024-11-26 14:05:53 +01:00
pnpm-lock.yaml Vite: Simplify preprocessor to make it work with Svelte 5 and Vite 6 (#15274) 2024-12-02 14:48:00 -05:00
pnpm-workspace.yaml Update Vite to 6.0 (#15197) 2024-11-27 11:34:50 -05:00
README.md Copy README file to every package (#13096) 2024-03-06 08:49:31 -05:00
rust-toolchain.toml Bring back rust-toolchain.toml (#14585) 2024-10-03 14:37:24 +00:00
turbo.json Auto source detection improvements (#14820) 2024-10-29 20:33:34 +00:00
vitest.workspace.ts introduce v4 codebase 2024-03-05 14:29:15 +01:00

Tailwind CSS

A utility-first CSS framework for rapidly building custom user interfaces.

Build Status Total Downloads Latest Release License


Documentation

For full documentation, visit tailwindcss.com.

Community

For help, discussion about best practices, or any other conversation that would benefit from being searchable:

Discuss Tailwind CSS on GitHub

For chatting with others using the framework:

Join the Tailwind CSS Discord Server

Contributing

If you're interested in contributing to Tailwind CSS, please read our contributing docs before submitting a pull request.