chore: use Tailwind Turbopack loader instead of PostCSS (#489)

Aligns the template and docs apps with the new create-next-app default
from vercel/next.js#96606, which uses @tailwindcss/turbopack and a
Turbopack CSS loader rule for Tailwind projects on the Turbopack path
instead of routing CSS through PostCSS.

- add the turbopack.rules CSS rule to both next.config.ts files
- delete postcss.config.mjs from both apps
- swap @tailwindcss/postcss for @tailwindcss/turbopack, drop postcss

No globals.css changes are needed; @import "tailwindcss", the typography
plugin, @theme inline, and tw-animate-css all work unchanged. Emitted CSS
is byte-identical to the PostCSS output in both apps.

Author: laugharn

apps/docs/next.config.ts

@@ -4,6 +4,14 @@ import type { NextConfig } from "next";
 const withMDX = createMDX();
 
 const config: NextConfig = {
+  turbopack: {
+    rules: {
+      "*.css": {
+        as: "*.css",
+        loaders: ["@tailwindcss/turbopack"],
+      },
+    },
+  },
   images: {
     formats: ["image/avif", "image/webp"],
     remotePatterns: [

apps/docs/package.json

@@ -12,7 +12,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@tailwindcss/postcss": "4.3.3",
+    "@tailwindcss/turbopack": "4.3.3",
     "@types/mdx": "2.0.14",
     "@types/node": "26.1.2",
     "@types/react": "19.2.18",
@@ -32,7 +32,6 @@
     "next": "16.3.0",
     "oxfmt": "0.61.0",
     "oxlint": "1.76.0",
-    "postcss": "8.5.22",
     "radix-ui": "1.6.0",
     "react": "19.2.8",
     "react-dom": "19.2.8",

apps/docs/postcss.config.mjs

@@ -54,6 +54,14 @@ const nextConfig: NextConfig = {
     unoptimized: !!process.env.V0_CALLBACK_URL,
   },
   reactCompiler: true,
+  turbopack: {
+    rules: {
+      "*.css": {
+        as: "*.css",
+        loaders: ["@tailwindcss/turbopack"],
+      },
+    },
+  },
   async rewrites() {
     return {
       beforeFiles: [

apps/template/next.config.ts

@@ -20,7 +20,7 @@
     "@json-render/react": "0.19.0",
     "@shopify/api-codegen-preset": "2.0.1",
     "@shopify/hydrogen": "0.0.0-preview-116d5d7-20260730141607",
-    "@tailwindcss/postcss": "4.3.3",
+    "@tailwindcss/turbopack": "4.3.3",
     "@tailwindcss/typography": "0.5.20",
     "@types/node": "26.1.2",
     "@types/react": "19.2.18",
@@ -37,7 +37,6 @@
     "next-intl": "4.13.4",
     "oxfmt": "0.61.0",
     "oxlint": "1.76.0",
-    "postcss": "8.5.25",
     "react": "19.2.8",
     "react-dom": "19.2.8",
     "server-only": "0.0.1",