Add Vite polyfills option by lubomirblazekcz · Pull Request #20036 · tailwindlabs/tailwindcss

lubomirblazekcz · 2026-05-11T07:41:23Z

Summary

Closes #20035, #20038

Test plan

Added integrations tests

coderabbitai · 2026-05-11T07:45:12Z

Walkthrough

This PR adds a polyfills option to the Tailwind Vite plugin configuration. The option passes from PluginOptions through createRoot and Root into CSS compilation. CSS Module compilation removes Polyfills.AtProperty. The README documents the option, and a test verifies disabled polyfills output.

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main change: adding a configurable polyfills option to the Vite plugin.
Description check	✅ Passed	The description identifies the linked issues and states that integration tests were added for the Vite polyfills option.
Linked Issues check	✅ Passed	The implementation adds the requested Vite polyfills option, supports disabling polyfills, documents usage, and includes integration coverage for the linked issue.
Out of Scope Changes check	✅ Passed	The code, documentation, and tests directly support the requested Vite polyfills configuration and contain no unrelated changes.

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

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

coderabbitai

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/`@tailwindcss-vite/README.md:
- Line 80: Update the README paragraph about the polyfills option to clarify
that while Tailwind's default is to emit all supported CSS polyfills, CSS
Modules intentionally mask the AtProperty polyfill; mention that the `polyfills`
option controls emission but that `AtProperty` will be omitted when using CSS
Modules unless explicitly enabled, referencing the `polyfills` option and the
`AtProperty` polyfill name so readers can find the relevant behavior.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 5ba356aa-0fca-455e-a068-f5eb916f3e45

📥 Commits

Reviewing files that changed from the base of the PR and between f9216b2 and 37ba9ad.

📒 Files selected for processing (3)

integrations/vite/index.test.ts
packages/@tailwindcss-vite/README.md
packages/@tailwindcss-vite/src/index.ts

coderabbitai · 2026-05-11T07:45:15Z

+
+## Controlling Tailwind polyfills
+
+By default, Tailwind emits all supported CSS polyfills. You can customize this behavior using the `polyfills` option:


⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

Clarify default behavior for CSS Modules in this section.

The “emits all supported CSS polyfills” sentence is not fully accurate for CSS Modules, where AtProperty is intentionally masked. A short note here would prevent confusion.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/`@tailwindcss-vite/README.md at line 80, Update the README paragraph about the polyfills option to clarify that while Tailwind's default is to emit all supported CSS polyfills, CSS Modules intentionally mask the AtProperty polyfill; mention that the `polyfills` option controls emission but that `AtProperty` will be omitted when using CSS Modules unless explicitly enabled, referencing the `polyfills` option and the `AtProperty` polyfill name so readers can find the relevant behavior.

greptile-apps · 2026-05-11T07:46:03Z

Confidence Score: 5/5

The PR appears safe to merge, with only non-blocking previously reported coverage and documentation feedback remaining.

No blocking failure remains; the outstanding prior threads concern missing regression coverage for the CSS Modules branch and incomplete API discoverability.

_{Reviews (2): Last reviewed commit: "Add Vite polyfills option" | Re-trigger Greptile}

greptile-apps · 2026-05-11T07:46:07Z

+        polyfills: inputPath.endsWith('.module.css')
+          ? this.polyfills & ~Polyfills.AtProperty
+          : this.polyfills,


CSS module polyfill stripping is untested

The new branch that strips Polyfills.AtProperty for .module.css files is not covered by any integration test. The parallel webpack and postcss plugins have the same logic already, and the comment explains why it's necessary, but without a test exercising a .module.css file with the vite plugin the guard could be silently removed or regressed. A test that builds a .module.css input and asserts @layer properties is absent would close this gap.

greptile-apps · 2026-05-11T07:46:08Z

+
+## Controlling Tailwind polyfills
+
+By default, Tailwind emits all supported CSS polyfills. You can customize this behavior using the `polyfills` option:
+
+```js
+import tailwindcss from '@tailwindcss/vite'
+import { defineConfig } from 'vite'
+import { Polyfills } from 'tailwindcss'
+
+export default defineConfig({
+  plugins: [
+    tailwindcss({
+      // Disable all Tailwind polyfills
+      polyfills: Polyfills.None,
+    }),
+  ],


Only Polyfills.None is shown; bitwise composition is undiscoverable

The README only demonstrates Polyfills.None. Because Polyfills is a bitflags enum (with AtProperty, ColorMix, and All), users who want to selectively disable just one polyfill (e.g., keep ColorMix but drop AtProperty) have no hint that they can pass Polyfills.ColorMix or Polyfills.AtProperty directly. A brief note or additional example showing per-flag control would make the API more discoverable.

Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

coderabbitai

🧹 Nitpick comments (1)

integrations/vite/index.test.ts (1)

1615-1617: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Add an enabled control for this polyfill fixture.

The assertions only prove that the output omits @layer properties. They also pass if this fixture never generates the AtProperty polyfill. Add a sibling case with polyfills: Polyfills.AtProperty and assert that it emits @layer properties. This validates the disabled path against an enabled baseline.

The PR objective requires selective polyfill retention.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: fbca53a5-c3fc-433e-a429-d7b70c23471f

📥 Commits

Reviewing files that changed from the base of the PR and between 37ba9ad and 21bdf85.

📒 Files selected for processing (3)

integrations/vite/index.test.ts
packages/@tailwindcss-vite/README.md
packages/@tailwindcss-vite/src/index.ts

🚧 Files skipped from review as they are similar to previous changes (2)

packages/@tailwindcss-vite/README.md
packages/@tailwindcss-vite/src/index.ts

lubomirblazekcz · 2026-08-04T08:02:41Z

@RobinMalfait we discussed this in #19942, is this good for merge? I can make changes if needed 👍

lubomirblazekcz requested a review from a team as a code owner May 11, 2026 07:41

coderabbitai Bot reviewed May 11, 2026

View reviewed changes

greptile-apps Bot reviewed May 11, 2026

View reviewed changes

syedahmedx3 mentioned this pull request Jun 30, 2026

Add support for polyfill configuration in Vite plugin #20038

Open

Add Vite polyfills option

21bdf85

lubomirblazekcz force-pushed the vite-polyfills-option branch from 37ba9ad to 21bdf85 Compare August 4, 2026 07:24

coderabbitai Bot reviewed Aug 4, 2026

View reviewed changes

Navigation Menu

Uh oh!

Uh oh!

Add Vite polyfills option - #20036

Add Vite polyfills option#20036
lubomirblazekcz wants to merge 1 commit into
tailwindlabs:mainfrom
lubomirblazekcz:vite-polyfills-option

lubomirblazekcz commented May 11, 2026 •

edited by RobinMalfait

Loading

Uh oh!

coderabbitai Bot commented May 11, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot left a comment

Uh oh!

coderabbitai Bot May 11, 2026

Uh oh!

greptile-apps Bot commented May 11, 2026 •

edited

Loading

Uh oh!

greptile-apps Bot May 11, 2026

Uh oh!

greptile-apps Bot May 11, 2026

Uh oh!

coderabbitai Bot left a comment

Uh oh!

lubomirblazekcz commented Aug 4, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant


		## Controlling Tailwind polyfills

		By default, Tailwind emits all supported CSS polyfills. You can customize this behavior using the `polyfills` option:

Uh oh!

Uh oh!

Conversation

lubomirblazekcz commented May 11, 2026 • edited by RobinMalfait Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Test plan

Uh oh!

coderabbitai Bot commented May 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

coderabbitai Bot May 11, 2026

Choose a reason for hiding this comment

Uh oh!

greptile-apps Bot commented May 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Confidence Score: 5/5

Uh oh!

greptile-apps Bot May 11, 2026

Choose a reason for hiding this comment

Uh oh!

greptile-apps Bot May 11, 2026

Choose a reason for hiding this comment

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

lubomirblazekcz commented Aug 4, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

lubomirblazekcz commented May 11, 2026 •

edited by RobinMalfait

Loading

coderabbitai Bot commented May 11, 2026 •

edited

Loading

greptile-apps Bot commented May 11, 2026 •

edited

Loading