Commit 706b2d03 by PLN (Algolia)

fix(tailwind): align PostCSS config with Tailwind v4 docs

Root cause: Vercel wasn't processing Tailwind through @tailwindcss/postcss,
serving raw CSS with zero utility classes (23KB theme-only vs 53KB with
utilities). The source() directive was output literally as @media source().

Fixes per official Tailwind v4 + Next.js setup:
- Switch postcss.config.js (CJS) → postcss.config.mjs (ESM)
- Remove autoprefixer (built into Tailwind v4)
- Use plain @import "tailwindcss" (auto source detection)
- Move tailwindcss + @tailwindcss/postcss to dependencies
parent d12fa8ed
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
"node": ">=18.17.0" "node": ">=18.17.0"
}, },
"dependencies": { "dependencies": {
"@tailwindcss/postcss": "^4.2.1",
"classnames": "^2.5.1", "classnames": "^2.5.1",
"d3-force": "^3.0.0", "d3-force": "^3.0.0",
"d3-zoom": "^3.0.0", "d3-zoom": "^3.0.0",
...@@ -30,6 +31,7 @@ ...@@ -30,6 +31,7 @@
"minisearch": "^7.1.2", "minisearch": "^7.1.2",
"next": "^15.3.0", "next": "^15.3.0",
"p5": "1.11.3", "p5": "1.11.3",
"postcss": "^8.5.8",
"prismjs": "^1.30.0", "prismjs": "^1.30.0",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
...@@ -46,11 +48,11 @@ ...@@ -46,11 +48,11 @@
"remark-html": "^15.0.0", "remark-html": "^15.0.0",
"snowball-stemmers": "^0.6.0", "snowball-stemmers": "^0.6.0",
"stopword": "^3.1.5", "stopword": "^3.1.5",
"swiper": "^11.2.6" "swiper": "^11.2.6",
"tailwindcss": "^4.2.1"
}, },
"devDependencies": { "devDependencies": {
"@playwright/test": "^1.55.0", "@playwright/test": "^1.55.0",
"@tailwindcss/postcss": "^4.1.17",
"@testing-library/dom": "^10.4.1", "@testing-library/dom": "^10.4.1",
"@testing-library/jest-dom": "^6.8.0", "@testing-library/jest-dom": "^6.8.0",
"@testing-library/react": "^16.3.0", "@testing-library/react": "^16.3.0",
...@@ -58,14 +60,11 @@ ...@@ -58,14 +60,11 @@
"@types/jest": "^30.0.0", "@types/jest": "^30.0.0",
"@types/node": "24.4.0", "@types/node": "24.4.0",
"@types/react": "^18.2.61", "@types/react": "^18.2.61",
"autoprefixer": "^10.4.22",
"jest": "^30.1.3", "jest": "^30.1.3",
"jest-environment-jsdom": "^30.1.2", "jest-environment-jsdom": "^30.1.2",
"jest-pnp-resolver": "^1.2.3", "jest-pnp-resolver": "^1.2.3",
"next-router-mock": "^1.0.2", "next-router-mock": "^1.0.2",
"playwright": "^1.58.2", "playwright": "^1.58.2",
"postcss": "^8.5.6",
"tailwindcss": "^4.1.17",
"typescript": "^5.3.3", "typescript": "^5.3.3",
"vercel": "^39" "vercel": "^39"
}, },
......
const config = {
plugins: {
"@tailwindcss/postcss": {},
},
};
export default config;
@import "tailwindcss" source("../"); @import "tailwindcss";
/* ParVagues palette */ /* ParVagues palette */
:root { :root {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment