wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Support migrating projects with multiple config files (#14863)

Browse source 
When migrating a project from Tailwind CSS v3 to Tailwind CSS v4, then
we started the migration process in the following order:

1. Migrate the JS/TS config file
2. Migrate the source files (found via the `content` option)
3. Migrate the CSS files

However, if you have a setup where you have multiple CSS root files
(e.g.: `frontend` and `admin` are separated), then that typically means
that you have an `@config` directive in your CSS files. These point to
the Tailwind CSS config file.

This PR changes the migration order to do the following:

1. Build a tree of all the CSS files
2. For each `@config` directive, migrate the JS/TS config file
3. For each JS/TS config file, migrate the source files

If a CSS file does not contain any `@config` directives, then we start
by filling in the `@config` directive with the default Tailwind CSS
config file (if found, or the one passed in). If no default config file
or passed in config file can be found, then we will error out (just like
we do now)

---------

Co-authored-by: Adam Wathan <adam.wathan@gmail.com>
This commit is contained in:
Robin Malfait 2024-11-04 17:52:11 +01:00 • committed by GitHub
parent df6dfb012c
commit 894bf9f5ef
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 533 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/tailwindcss/src/compat/config/types.ts
View file

@ -25,7 +25,7 @@ export interface ResolvedConfig {
type ContentFile = string | { raw: string; extension?: string }
export interface UserConfig {
content?: ContentFile[] | { files: ContentFile[] }
content?: ContentFile[] | { relative?: boolean; files: ContentFile[] }
}
type ResolvedContent = { base: string; pattern: string } | { raw: string; extension?: string }

4
packages/tailwindcss/tests/ui.spec.ts
View file

@ -1,7 +1,7 @@
import { expect, test, type Page } from '@playwright/test'
import { Scanner } from '@tailwindcss/oxide'
import fs from 'fs'
import path from 'path'
import fs from 'node:fs'
import path from 'node:path'
import { compile } from '../src'
import { optimizeCss } from '../src/test-utils/run'