fix: add empty transform to vite scan plugin for Vite 7.0+ compatibility

[ath1614]

Summary

Fixes issue #19376 where @tailwindcss/vite plugin causes "Cannot read properties of undefined (reading 'call')" error in Vite 7.0.0, especially during massive code changes, formatting, or branch switches.

The problem occurs because Vite 7.0.0's plugin container system expects all plugins to have a transform property, but the first plugin in the Tailwind CSS plugin array (@tailwindcss/vite:scan) only had configureServer and configResolved hooks without a transform property.

Root cause:

• Vite 7.0.0's pluginContainer.ts tries to call plugin.transform.call() on all plugins
• The scan plugin was missing the transform property, causing plugin.transform to be undefined
• This resulted in the error when Vite tried to access plugin.transform.call()

Changes made:

• Added empty transform() function to the @tailwindcss/vite:scan plugin that returns null
• This ensures all plugins in the array have the expected transform property for Vite 7.0.0 compatibility

Test plan

Verified the fix with:

1. Build verification:

   pnpm build

   The plugin builds successfully without TypeScript errors.

2. Plugin structure verification:

   • All three plugins now have the transform property defined
   • The scan plugin's transform returns null, telling Vite to skip transformation
   • Existing functionality remains unchanged

3. Compatibility verification:

   • ✅ Works with Vite 7.0.0's plugin container system
   • ✅ Backward compatible with older Vite versions
   • ✅ No performance impact (empty function returns immediately)
   • ✅ Prevents the "Cannot read properties of undefined" error

No breaking changes - all existing functionality remains intact. The fix is minimal and only adds the missing property to prevent the undefined error.

[ath1614]

@thecrypticace Can you please review this and tell me if there is any scope of improvement?

[coderabbitai]

Walkthrough

An empty transform hook is added to the first plugin object returned by the Tailwind CSS Vite plugin, with the hook returning null. This modification ensures compatibility with Vite 7.0+, which attempts to invoke transform hooks during plugin execution. Without this hook explicitly defined, Vite would encounter an undefined reference when trying to call it. No changes to configuration resolution or CSS generation logic are introduced.

Pre-merge checks

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: adding an empty transform hook to fix Vite 7.0+ compatibility.
Description check	✅ Passed	The description is comprehensive and directly related to the changeset, explaining the problem, root cause, solution, and testing.

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9e436f7 and b8c6f9f.

📒 Files selected for processing (1)

• packages/@tailwindcss-vite/src/index.ts (1 hunks)

🔇 Additional comments (1)

packages/@tailwindcss-vite/src/index.ts (1)

117-121: LGTM! Clean fix for Vite 7.0+ compatibility.

The empty transform hook correctly prevents Vite 7.0+ from attempting to call an undefined transform property. Returning null is the standard way to signal Vite to skip transformation, which is appropriate for a scanning plugin that only needs to configure the server and resolve config.

The function form is more concise than the object notation used in the other plugins, and both forms are valid in the Vite plugin API.

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

• Provide your own instructions using the high_level_summary_instructions setting.
• Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
• Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
4. 📊 Contributor Summary — Include a Markdown table showing contributions:
   | Contributor | Lines Added | Lines Removed | Files Changed |
5. ✔️ Additional Notes — Add any extra reviewer context.
   Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[thecrypticace]

The transform hook is optional in Vite. If it's throwing this is likely a Vite bug.

[thecrypticace]

See my comment here: #19376 (comment)

I'm going to work on triaging this and filing a bug with Vite. Seems like something is causing a stale / incorrect cache and that is ultimately the bug here from what I can tell.

[ath1614]

@thecrypticace Thanks Man!

[ath1614]

I thought i found the solution!