feat(compiler): add tailwind css variables generation from vuestic.co… #4560
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
👷 Deploy request for vuestic-docs pending review.Visit the deploys page to approve it
|
✅ Deploy Preview for vuestic-storybook ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
There was a problem hiding this comment.
Pull Request Overview
This PR adds Tailwind CSS v4 support to the Vuestic UI compiler, enabling automatic generation of CSS variables from Vuestic config colors for use as Tailwind classes. The implementation replaces the previous Tailwind v3 integration with a new v4-compatible approach.
Key changes:
- Implements a new
vuesticTailwindcompiler plugin that automatically generates CSS variables from Vuestic config colors - Updates documentation and create-vuestic tooling to use Tailwind CSS v4 with the new
@tailwindcss/viteplugin - Simplifies Tailwind integration by removing the need for separate config files and using the new
@import "tailwindcss"syntax
Reviewed Changes
Copilot reviewed 19 out of 20 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/compiler/tailwindcss/index.ts | New plugin that transforms CSS imports and generates Tailwind-compatible CSS variables from Vuestic colors |
| packages/compiler/shared/vuestic-config.ts | Utility functions for reading and watching Vuestic config files |
| packages/compiler/shared/ts.ts | TypeScript module execution utilities for dynamic config loading |
| packages/docs/page-config/compiler/tailwind/index.ts | New documentation page for Tailwind integration |
| packages/create-vuestic/src/steps/2.2.addTailwind.ts | Updated scaffolding to use Tailwind v4 syntax and dependencies |
| packages/docs/nuxt.config.ts | Migration from @nuxtjs/tailwindcss to @tailwindcss/vite plugin |
Comments suppressed due to low confidence (2)
packages/compiler/package.json:19
- The version "^4.0.0" for @tailwindcss/vite does not exist. The latest available version is "^4.1.11" as shown in other parts of the codebase.
"@tailwindcss/vite": "^4.0.0",
packages/compiler/package.json:21
- The version "^4.0.0" for tailwindcss does not exist. The correct version should be "^4.1.11" as used elsewhere in the codebase.
"tailwindcss": "^4.0.0",
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.