CSS codemod: Migrate @import "tailwindcss/tailwind.css" to @import "tailwindcss" (#14514)
This PR adds an additional step to ensure we migrate: ```css @import "tailwindcss/tailwind.css"; ``` To: ```css @import "tailwindcss"; ```
This commit is contained in:
parent
723f5db38b
commit
e770c0da30
3 changed files with 17 additions and 1 deletions
|
|
@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
|
||||
- _Experimental_: Improve codemod output, keep CSS after last Tailwind directive unlayered ([#14512](https://github.com/tailwindlabs/tailwindcss/pull/14512))
|
||||
- _Experimental_: Fix incorrect empty `layer()` at the end of `@import` at-rules when running codemods ([#14513](https://github.com/tailwindlabs/tailwindcss/pull/14513))
|
||||
- _Experimental_: Migrate `@import "tailwindcss/tailwind.css"` to `@import "tailwindcss"` ([#14514](https://github.com/tailwindlabs/tailwindcss/pull/14514))
|
||||
|
||||
## [4.0.0-alpha.25] - 2024-09-24
|
||||
|
||||
|
|
|
|||
|
|
@ -24,6 +24,16 @@ it("should not migrate `@import 'tailwindcss'`", async () => {
|
|||
`)
|
||||
})
|
||||
|
||||
it('should migrate the tailwind.css import', async () => {
|
||||
expect(
|
||||
await migrate(css`
|
||||
@import 'tailwindcss/tailwind.css';
|
||||
`),
|
||||
).toEqual(css`
|
||||
@import 'tailwindcss';
|
||||
`)
|
||||
})
|
||||
|
||||
it('should migrate the default @tailwind directives to a single import', async () => {
|
||||
expect(
|
||||
await migrate(css`
|
||||
|
|
|
|||
|
|
@ -15,8 +15,13 @@ export function migrateTailwindDirectives(): Plugin {
|
|||
let layerOrder: string[] = []
|
||||
|
||||
root.walkAtRules((node) => {
|
||||
// Migrate legacy `@import "tailwindcss/tailwind.css"`
|
||||
if (node.name === 'import' && node.params.match(/^["']tailwindcss\/tailwind\.css["']$/)) {
|
||||
node.params = node.params.replace('tailwindcss/tailwind.css', 'tailwindcss')
|
||||
}
|
||||
|
||||
// Track old imports and directives
|
||||
if (
|
||||
else if (
|
||||
(node.name === 'tailwind' && node.params === 'base') ||
|
||||
(node.name === 'import' && node.params.match(/^["']tailwindcss\/base["']$/))
|
||||
) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue