diff --git a/CHANGELOG.md b/CHANGELOG.md index 9a08d0c63071..6030c14f36d3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +### Added + +- _Upgrade (experimental)_: Bump `prettier-plugin-tailwindcss` to latest version during upgrade ([#14808](https://github.com/tailwindlabs/tailwindcss/pull/14808)) + ### Fixed - Support calling `config()` with no arguments in plugin API ([#14799](https://github.com/tailwindlabs/tailwindcss/pull/14799)) diff --git a/integrations/upgrade/index.test.ts b/integrations/upgrade/index.test.ts index cd89f6d38b6f..848e42bcfe61 100644 --- a/integrations/upgrade/index.test.ts +++ b/integrations/upgrade/index.test.ts @@ -1629,3 +1629,33 @@ test( `) }, ) + +test( + 'migrating the prettier-plugin-tailwindcss version', + { + fs: { + 'package.json': json` + { + "dependencies": { + "tailwindcss": "workspace:^", + "@tailwindcss/upgrade": "workspace:^" + }, + "devDependencies": { + "prettier-plugin-tailwindcss": "0.5.0" + } + } + `, + 'tailwind.config.js': js`module.exports = {}`, + }, + }, + async ({ fs, exec }) => { + await exec('npx @tailwindcss/upgrade --force') + + let pkg = JSON.parse(await fs.read('package.json')) + + expect(pkg.devDependencies).toMatchObject({ + 'prettier-plugin-tailwindcss': expect.any(String), + }) + expect(pkg.devDependencies['prettier-plugin-tailwindcss']).not.toEqual('0.5.0') + }, +) diff --git a/packages/@tailwindcss-upgrade/src/index.ts b/packages/@tailwindcss-upgrade/src/index.ts index 46b1fd6729e6..767bec8f882c 100644 --- a/packages/@tailwindcss-upgrade/src/index.ts +++ b/packages/@tailwindcss-upgrade/src/index.ts @@ -13,6 +13,7 @@ import { } from './migrate' import { migrateJsConfig } from './migrate-js-config' import { migratePostCSSConfig } from './migrate-postcss' +import { migratePrettierPlugin } from './migrate-prettier' import { Stylesheet } from './stylesheet' import { migrate as migrateTemplate } from './template/migrate' import { prepareConfig } from './template/prepare-config' @@ -191,6 +192,11 @@ async function run() { await migratePostCSSConfig(base) } + { + // Migrate the prettier plugin to the latest version + await migratePrettierPlugin(base) + } + try { // Upgrade Tailwind CSS await pkg('add tailwindcss@next', base) diff --git a/packages/@tailwindcss-upgrade/src/migrate-prettier.ts b/packages/@tailwindcss-upgrade/src/migrate-prettier.ts new file mode 100644 index 000000000000..9ff1e824db9f --- /dev/null +++ b/packages/@tailwindcss-upgrade/src/migrate-prettier.ts @@ -0,0 +1,15 @@ +import fs from 'node:fs/promises' +import path from 'node:path' +import { pkg } from './utils/packages' +import { success } from './utils/renderer' + +export async function migratePrettierPlugin(base: string) { + let packageJsonPath = path.resolve(base, 'package.json') + try { + let packageJson = await fs.readFile(packageJsonPath, 'utf-8') + if (packageJson.includes('prettier-plugin-tailwindcss')) { + await pkg('add prettier-plugin-tailwindcss@latest', base) + success(`Prettier plugin migrated to latest version.`) + } + } catch {} +}