tailwind/v4-entry

Why

Tailwind 4 removed the @tailwind base; @tailwind components; @tailwind utilities; directives and no longer finds tailwind.config.js on its own. A project upgraded by changing the version number builds without errors but ships without utilities, or without the colours, fonts and plugins its JS config defined.

Fix

Run npx @tailwindcss/upgrade (Node.js 20 or newer) on a clean branch. By hand: replace the three directives with @import "tailwindcss";, move the theme into @theme { ... } in that CSS file, or keep the JS config for now with @config "../tailwind.config.js"; right after the import.

Examples

/* bad (tailwindcss 4 in package.json) */
@tailwind base;
@tailwind components;
@tailwind utilities;
/* good */
@import "tailwindcss";
@theme { --color-brand-600: #0a7a3e; }

Sources

• Tailwind CSS docs, Upgrade guide (removed @tailwind directives, using a JavaScript config file)
• Tailwind CSS docs, Functions and directives (@import, @config)

Read it in the terminal

npx github:dawidolko/frontend-skills explain tailwind/v4-entry