plugin-tailwindcss: tailwind v4#2829
Conversation
|
@lucacasonato can I have help here there some issues with deno/workspace with my changes www shouldn't use tailwind 4 but it's do it. I'm not deno expert so could you take a look ? Edit updating to Deno v2.2.2 fix issue |
|
@AugustinMauroy, can you publish this separately whilst we wait for it to get merged? |
What do you mean ? |
I mean, could you publish the @fresh/plugin-tailwind package to JSR as @AugustinMauroy/fresh-plugin-tailwind or whatever so it can be used until it gets merged? |
But I saw you are learning web dev. So what I can recommend it's to wait official plugin. |
And where did you see that? |
|
of topic but your GH profile said that your are learning Preact/fresh |
Oh, I haven't updated that in a while. I was learning it last year, now I feel fairly comfortable with it, I use it for most new web projects I do. |
|
@lucacasonato need that to upgrade JSR to tailwind v4 |
|
Yeah I'll check |
|
@SisyphusZheng i had fix WWW but test are failling I didn't get why it's falling |
Checkout the logs https://github.com/denoland/fresh/actions/runs/14926742379/job/41933249430?pr=2829 |
|
|
it's should not because there are |
hello, I managed to make the modification work successfully based on your code, but only when node_modules is present. In the code you provided, the /www directory wasn't supported by the modified source code. Instead, it relied on the plugins previously built with Tailwind v3. When I tried to switch to using the provided plugin source code for support, it still didn't seem to work properly. I checked the upstream plugin mentioned in #2819, which this plugin's code is based on, and found that it has the same issue as mine. It appears to only work correctly with node_modules support. Additionally, there are some discrepancies between that upstream plugin and our target requirements. The specific problem I'm encountering now is what I mentioned in #2819. |
|
Humm it's seam be a deno issue. Because tailwind v4 need node_module. Because they've created a complete system for parsing and transforming css. Which is faster, but needs the node module. Because it uses native adon |
Inspired by #2819, #2829, and https://github.com/pakornv/fresh-plugin-tailwindcss, I made minimal modifications to the plugin-tailwind, I originally intended to update based on #2829, but I was informed by the system that I couldn't push. Due to the breaking changes in Tailwind v4, some PostCSS plugins are no longer required. Additionally, I updated the syntax in the /www directory. The /www directory now uses the updated plugin supported by Tailwind v4.I think this has made initial progress. # What This PR Solves The Tailwind plugin has been updated to support Tailwind v4, and it is currently functioning well both in the repository's www directory and in the initialized project which for test. ## --patch-1 ### 1. Dependency Optimization - Removed `cssnano` dependency, using Tailwind v4's built-in optimization(Based on @csvn 's suggestion) - Removed `autoprefixer` dependency - Updated `tailwind-plugin` version number ### 2. Build Configuration Adjustments - Added `--node-modules-dir` parameter to `/www` task for Tailwind v4 support (Based on @marvinhagemeister 's suggestion) - Added `--allow-scripts` parameter to enable `@tailwindcss/oxide` execution ### 3. Code Adaptation - Modified Tailwind-related code in `/www` to support Tailwind v4 - Updated dependency configuration in `deno.json` ### 4. Feature Restoration - Added `imagescript` and `astral` dependencies to restore screenshot functionality lost in previous PR updates - Fixed the issue where the `tailwind-plugin` dependency was incorrectly pointing to the JSR package instead of the local repository source code in previous PR. ## --patch-2 - Upgraded Tailwind CSS to the latest version. - Removed unnecessary dependencies. - Enabled CSS minification by default when Fresh is in production mode. - Updated docs/canary/examples/migration-guide.md to support the new Tailwind plugin format. - Updated init/src/init.ts to support the new Tailwind version and plugin version, use new `@import "tailwindcss"`, and generate the new plugin format. - Updated init/src/init_test.ts: tests now expect `css` to match `/tailwindcss/` instead of `/@tailwind/`. - Removed plugin-tailwindcss/src/types.ts as it is no longer needed, and updated plugin-tailwindcss/src/mod.ts and www/dev.ts to support the new format. Co-authored-by: Asher Gomez <ashersaupingomez@gmail.com> ## --patch-3 Addressing @marvinhagemeister feedback, this patch reverts the unintended loss of PR #2960's changes caused by merge conflicts. ## --patch-4 I initialized a project according to the migration documentation and used @fresh/update to test whether the plugin works properly with v2-alpha-34. The results show that it works fine. - The plugin is published at jsr:@freshpress/fresh-plugin-tailwind@0.0.1-alpha.8. - The test project is published at https://github.com/SisyphusZheng/fresh-project-test/tree/main/fresh-project. # How Testing Was Conducted ## Local Environment Testing 1. Environment Cleanup ```bash rm -rf ./.cache/deno deno.lock node_modules ``` 2. Test Execution ```bash deno task www ``` 3. Result Verification - Checked functionality in local `/www` environment - Confirmed all features working properly ## Code Inspection - Passed `deno task ok` check ## This forked /www website is hosted and running on GitHub Codespaces, with support for the latest code changes. You can check it out at: https://silver-trout-pjr4jw7xx5x9299x6-8000.app.github.dev/ --------- Co-authored-by: 李嘉图·M·路 <146103794+Ricardo-M-Zheng@users.noreply.github.com> Co-authored-by: deno-deploy[bot] <75045203+deno-deploy[bot]@users.noreply.github.com> Co-authored-by: Asher Gomez <ashersaupingomez@gmail.com> Co-authored-by: Marvin Hagemeister <marvin@deno.com>
|
@marvinhagemeister, I think this has been superseded? |
|
Superseded by #3054 |

close #2819