fix: match static files in dev based on the pathname to fix HMR (#69)

* Upgrade Remix * Match static files in dev against the pathname * Add changelog * chore: update url creation so doubleslashes dont cause an issue #61 Signed-off-by: Logan McAnsh <[email protected]> --------- Signed-off-by: Logan McAnsh <[email protected]> Co-authored-by: Logan McAnsh <[email protected]>
mcansh · Feb 24, 2023 · 394c89c · 394c89c
1 parent 513a627
commit 394c89c
Show file tree

Hide file tree

Showing 5 changed files with 127 additions and 18 deletions.
diff --git a/.changeset/gorgeous-carpets-crash.md b/.changeset/gorgeous-carpets-crash.md
@@ -0,0 +1,5 @@
+---
+"@mcansh/remix-fastify": minor
+---
+
+Match static files in development based on the pathname to fix HMR.
diff --git a/example/package.json b/example/package.json
@@ -13,15 +13,15 @@
   },
   "dependencies": {
     "@mcansh/remix-fastify": "workspace:*",
-    "@remix-run/node": "1.12.0",
-    "@remix-run/react": "1.12.0",
+    "@remix-run/node": "1.13.0",
+    "@remix-run/react": "1.13.0",
     "fastify": "^4.12.0",
     "isbot": "^3.6.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@remix-run/dev": "1.12.0",
+    "@remix-run/dev": "1.13.0",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",
     "dotenv": "^16.0.3",

diff --git a/example/remix.config.js b/example/remix.config.js
@@ -6,7 +6,6 @@ module.exports = {
   appDirectory: "app",
   assetsBuildDirectory: "public/build",
   serverBuildPath: "build/index.js",
-  publicPath: "/build/",
   future: {
     unstable_dev: true,
     v2_routeConvention: true,

diff --git a/packages/remix-fastify/src/plugin.ts b/packages/remix-fastify/src/plugin.ts
@@ -1,5 +1,5 @@
 import * as path from "node:path";
-import { pathToFileURL } from "node:url";
+import { pathToFileURL, URL } from "node:url";
 import fastifyStatic from "@fastify/static";
 import type { ServerBuild } from "@remix-run/node";
 import type { FastifyPluginAsync, FastifyReply } from "fastify";
@@ -85,9 +85,12 @@ let remixFastify: FastifyPluginAsync<PluginOptions> = async (
         rootDir
       );
 
+      let origin = `${request.protocol}://${request.hostname}`;
+      let url = new URL(`${origin}${request.url}`);
+
       let staticFile = staticFiles.find((file) => {
         return (
-          request.url ===
+          url.pathname ===
           (file.isBuildAsset ? file.browserAssetUrl : file.filePublicPath)
         );
       });

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml