Merge branch 'support-lazy-error-component-on-before-load' of https://github.com/beaussan/router into support-lazy-error-component-on-before-load

Author: beaussan

docs/start/config.json

@@ -329,6 +329,14 @@
             {
               "label": "Cloudflare Vite Plugin",
               "to": "framework/solid/examples/start-basic-cloudflare"
+            },
+            {
+              "label": "Netlify Vite Plugin",
+              "to": "framework/solid/examples/start-basic-netlify"
+            },
+            {
+              "label": "Nitro Vite Plugin",
+              "to": "framework/solid/examples/start-basic-nitro"
             }
           ]
         }

docs/start/framework/react/guide/hosting.md

@@ -148,6 +148,9 @@ Add a `netlify.toml` file to your project root:
 [build]
   command = "vite build"
   publish = "dist/client"
+[dev]
+  command = "vite dev"
+  port = 3000
 ```
 
 Deploy your application using their one-click deployment process, and you're ready to go!

docs/start/framework/solid/guide/hosting.md

@@ -142,6 +142,9 @@ Add a `netlify.toml` file to your project root:
 [build]
   command = "vite build"
   publish = "dist/client"
+[dev]
+  command = "vite dev"
+  port = 3000
 ```
 
 Deploy your application using their one-click deployment process, and you're ready to go!

e2e/react-router/basic-file-based-code-splitting/package.json

@@ -13,14 +13,14 @@
     "test:e2e": "rm -rf port*.txt; pnpm run test:e2e:verbose-routes:true && pnpm run test:e2e:verbose-routes:false"
   },
   "dependencies": {
+    "@tailwindcss/postcss": "^4.1.15",
     "@tanstack/react-router": "workspace:^",
     "@tanstack/react-router-devtools": "workspace:^",
     "@tanstack/router-plugin": "workspace:^",
+    "postcss": "^8.5.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "postcss": "^8.5.1",
-    "autoprefixer": "^10.4.20",
-    "tailwindcss": "^3.4.17",
+    "tailwindcss": "^4.1.15",
     "zod": "^3.24.2"
   },
   "devDependencies": {

e2e/react-router/basic-file-based-code-splitting/postcss.config.mjs

@@ -1,6 +1,5 @@
 export default {
   plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
+    '@tailwindcss/postcss': {},
   },
 }

e2e/react-router/basic-file-based-code-splitting/src/styles.css

@@ -1,6 +1,14 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import 'tailwindcss';
+
+@layer base {
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentcolor);
+  }
+}
 
 html {
   color-scheme: light dark;

e2e/react-router/basic-file-based-code-splitting/tailwind.config.mjs

@@ -11,16 +11,16 @@
     "test:e2e": "rm -rf port*.txt; playwright test --project=chromium"
   },
   "dependencies": {
+    "@tailwindcss/postcss": "^4.1.15",
     "@tanstack/react-router": "workspace:^",
     "@tanstack/react-router-devtools": "workspace:^",
     "@tanstack/router-plugin": "workspace:^",
     "@tanstack/zod-adapter": "workspace:^",
+    "postcss": "^8.5.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "redaxios": "^0.5.1",
-    "postcss": "^8.5.1",
-    "autoprefixer": "^10.4.20",
-    "tailwindcss": "^3.4.17",
+    "tailwindcss": "^4.1.15",
     "zod": "^3.24.2"
   },
   "devDependencies": {

e2e/react-router/basic-file-based/package.json

@@ -1,6 +1,5 @@
 export default {
   plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
+    '@tailwindcss/postcss': {},
   },
 }

e2e/react-router/basic-file-based/postcss.config.mjs

@@ -124,7 +124,7 @@ function AnchorComponent() {
             <label>
               <span>Target Anchor</span>
               <select
-                className="border border-opacity-50 rounded p-2 w-full"
+                className="border border-opacity-50 rounded-sm p-2 w-full"
                 data-testid="hash-select"
                 defaultValue={location.hash || anchors[0].id}
                 name="hash"
@@ -154,7 +154,7 @@ function AnchorComponent() {
                 <label>
                   <span>Behavior</span>
                   <select
-                    className="border border-opacity-50 rounded p-2 w-full"
+                    className="border border-opacity-50 rounded-sm p-2 w-full"
                     data-testid="behavior-select"
                     defaultValue="instant"
                     name="scrollBehavior"
@@ -170,7 +170,7 @@ function AnchorComponent() {
                 <label>
                   <span>Block</span>
                   <select
-                    className="border border-opacity-50 rounded p-2 w-full"
+                    className="border border-opacity-50 rounded-sm p-2 w-full"
                     data-testid="block-select"
                     defaultValue="start"
                     name="scrollBlock"
@@ -187,7 +187,7 @@ function AnchorComponent() {
                 <label>
                   <span>Inline</span>
                   <select
-                    className="border border-opacity-50 rounded p-2 w-full"
+                    className="border border-opacity-50 rounded-sm p-2 w-full"
                     data-testid="inline-select"
                     defaultValue="nearest"
                     name="scrollInline"
@@ -203,7 +203,7 @@ function AnchorComponent() {
           ) : null}
           <div>
             <button
-              className="bg-blue-500 rounded p-2 uppercase text-white font-black disabled:opacity-50"
+              className="bg-blue-500 rounded-sm p-2 uppercase text-white font-black disabled:opacity-50"
               data-testid="navigate-button"
             >
               Navigate