Skip to content

Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent #17717

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.

Sign up for GitHub

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

Merged
merged 36 commits into from
Apr 22, 2025
+640 −323
Merged

Ensure @tailwindcss/upgrade runs on Tailwind CSS v4 projects and is idempotent #17717

Changes from 1 commit
Commits
Show all changes
36 commits
Select commit Hold shift + click to select a range
e326b54
add semver dependency
RobinMalfait Mar 31, 2025
83bf845
do not require Tailwind CSS v3 projects anymore
RobinMalfait Apr 1, 2025
2879f4e
add `version` related helpers
RobinMalfait Apr 18, 2025
ba315ec
conditionally apply migrations based on version number
RobinMalfait Apr 18, 2025
0f97d3e
only link stylesheets to JS config files when migrating Tailwind CSS …
RobinMalfait Apr 18, 2025
6bef56e
only split stylesheets when migrating Tailwind CSS v3 projects
RobinMalfait Apr 18, 2025
986092a
only migrate PostCSS config when migrating Tailwind CSS v3 projects
RobinMalfait Apr 18, 2025
cfaeb55
only migrate JS files if they have linked config paths
RobinMalfait Apr 18, 2025
2f6e368
make `jsConfigMigration` nullable
RobinMalfait Apr 18, 2025
f78f582
change order
RobinMalfait Apr 18, 2025
b6089e4
bail on empty config
RobinMalfait Apr 18, 2025
a2836e5
make `UserConfig` nullable
RobinMalfait Apr 18, 2025
c52201f
migrate source files based on Tailwind root stylesheets
RobinMalfait Apr 18, 2025
eacaabf
remove unused `hoistStaticGlobParts`
RobinMalfait Apr 18, 2025
9be7647
make `configFilePath` also nullable
RobinMalfait Apr 18, 2025
bc93e2c
do not migrate `preflight` in non-v3 projects
RobinMalfait Apr 18, 2025
51b2200
run prettier
RobinMalfait Apr 18, 2025
6a492da
upgrade `tailwindcss` after we migrated the stylesheets
RobinMalfait Apr 18, 2025
c5ec584
remove test that requires Tailwind CSS v3
RobinMalfait Apr 18, 2025
71f3461
make the `DesignSystem` fully nullable
RobinMalfait Apr 18, 2025
6ffa7cb
mock version in local tests
RobinMalfait Apr 18, 2025
4f987fa
only migrate `@layer` in v3 projects
RobinMalfait Apr 18, 2025
1b53461
add migrations for newly deprecated classes
RobinMalfait Apr 18, 2025
6085b47
add `:user-valid` and `:user-invalid` arbitrary variant replacements
RobinMalfait Apr 18, 2025
a6d4309
replace arbitrary `@media` variants
RobinMalfait Apr 18, 2025
5857fd0
handle `[@media_not(…)]` variants
RobinMalfait Apr 18, 2025
ba4cab7
handle `@media` with single argument (e.g.: `@media print`)
RobinMalfait Apr 18, 2025
0e61002
ensure we re-print the candidate in case it didn't change
RobinMalfait Apr 18, 2025
37323c6
add tests to ensure upgrade tool runs on v4 and is idempotent
RobinMalfait Apr 18, 2025
aadc926
add test to ensure upgrade runs on v4 projects
RobinMalfait Apr 18, 2025
d20902f
only commit changes in dirty git repo
RobinMalfait Apr 19, 2025
94ef122
Merge branch 'main' into feat/enable-codemods-on-v4-projects
RobinMalfait Apr 22, 2025
7bbeb99
Merge branch 'main' into feat/enable-codemods-on-v4-projects
RobinMalfait Apr 22, 2025
3d8eed9
adjust comment
RobinMalfait Apr 22, 2025
fff3cc0
update changelog
RobinMalfait Apr 22, 2025
6b5935c
add new migration examples to upgrade test
RobinMalfait Apr 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,16 @@ const LEGACY_CLASS_MAP: Record<string, string> = {

'decoration-clone': 'box-decoration-clone',
'decoration-slice': 'box-decoration-slice',

// Since v4.1.0
'bg-left-top': 'bg-top-left',
'bg-left-bottom': 'bg-bottom-left',
'bg-right-top': 'bg-top-right',
'bg-right-bottom': 'bg-bottom-right',
'object-left-top': 'object-top-left',
'object-left-bottom': 'object-bottom-left',
'object-right-top': 'object-top-right',
'object-right-bottom': 'object-bottom-right',
}

let seenDesignSystems = new WeakSet<DesignSystem>()
Expand Down