test

package.json

@@ -9,18 +9,18 @@
   },
   "dependencies": {
     "@solidjs/meta": "^0.29.3",
-    "@solidjs/router": "^0.10.10",
-    "@solidjs/start": "^0.4.11",
+    "@solidjs/router": "^0.13.0",
+    "@solidjs/start": "^0.7.5",
     "solid-icons": "^1.1.0",
-    "solid-js": "^1.8.12"
+    "solid-js": "^1.8.15"
   },
   "devDependencies": {
-    "autoprefixer": "^10.4.17",
-    "postcss": "^8.4.33",
-    "prettier": "^3.2.4",
-    "prettier-plugin-tailwindcss": "^0.5.11",
+    "autoprefixer": "^10.4.18",
+    "postcss": "^8.4.35",
+    "prettier": "^3.2.5",
+    "prettier-plugin-tailwindcss": "^0.5.12",
     "tailwindcss": "^3.4.1",
-    "typescript": "^5.3.3",
+    "typescript": "^5.4.2",
     "vinxi": "^0.1.10"
   },
   "engines": {

src/app.css

@@ -19,7 +19,9 @@ body {
 
 @layer base {
   .cursor-newtab {
-    cursor: url('/images/new-tab.png') 10 10, pointer;
+    cursor:
+      url("/images/new-tab.png") 10 10,
+      pointer;
   }
 
   .h0 {
@@ -51,8 +53,12 @@ body {
   .animated-underline {
     background-image: linear-gradient(#33333300, #33333300),
       linear-gradient(to right, red, black);
-    background-size: 100% 2px, 0 2px;
-    background-position: 100% 100%, 0 100%;
+    background-size:
+      100% 2px,
+      0 2px;
+    background-position:
+      100% 100%,
+      0 100%;
     background-repeat: no-repeat;
   }
   @media (prefers-reduced-motion: no-preference) {
@@ -64,7 +70,9 @@ body {
   }
   .animated-underline:hover,
   .animated-underline:focus-visible {
-    background-size: 0 2px, 100% 2px;
+    background-size:
+      0 2px,
+      100% 2px;
   }
 }
 

src/app.tsx

@@ -1,18 +1,11 @@
-// @refresh reload
 import { Router } from "@solidjs/router";
-import { FileRoutes } from "@solidjs/start";
+import { FileRoutes } from "@solidjs/start/router";
 import { Suspense } from "solid-js";
 import "./app.css";
 
 export default function App() {
   return (
-    <Router
-      root={(props) => (
-        <>
-          <Suspense>{props.children}</Suspense>
-        </>
-      )}
-    >
+    <Router root={(props) => <Suspense>{props.children}</Suspense>}>
       <FileRoutes />
     </Router>
   );

src/entry-client.tsx

@@ -1,3 +1,11 @@
+// @refresh reload
 import { mount, StartClient } from "@solidjs/start/client";
 
-mount(() => <StartClient />, document.getElementById("app"));
+mount(() => <StartClient />, document.getElementById("app")!);
+
+// if (import.meta.env.PROD && "serviceWorker" in navigator) {
+//   // Use the window load event to keep the page load performant
+//   window.addEventListener("load", () => {
+//     navigator.serviceWorker.register(`/sw.js`);
+//   });
+// }

src/entry-server.tsx

@@ -1,5 +1,5 @@
-import { createHandler } from "@solidjs/start/entry";
-import { StartServer } from "@solidjs/start/server";
+// @refresh reload
+import { createHandler, StartServer } from "@solidjs/start/server";
 
 export default createHandler(() => (
   <StartServer