hmr reload paths fixed

This commit is contained in:
Seth Trowbridge 2025-10-16 08:36:46 -04:00
parent dfa3877013
commit d925b8d75e
4 changed files with 12 additions and 8 deletions

View File

@ -6,7 +6,7 @@ function App(){
const [countGet, countSet] = React.useState(2); const [countGet, countSet] = React.useState(2);
return <> return <>
<p style={{padding:"2rem", background:"black", color:"white"}}>test paragraph</p> <p style={{padding:"2rem", background:"tomato", color:"white"}}>test paragraph</p>
<button onClick={()=>{countSet(countGet+1)}}>{countGet}</button> <button onClick={()=>{countSet(countGet+1)}}>{countGet}</button>
</> </>
} }

View File

@ -22,7 +22,8 @@ function connect() {
}); });
socket.addEventListener("message", async (ev) => { socket.addEventListener("message", async (ev) => {
try { try {
const reloadPath = location.origin + ev.data + "?reload=" + Math.random(); const filePath = ev.data.startsWith(".") ? ev.data.slice(1) : ev.data;
const reloadPath = location.origin + filePath + "?reload=" + Math.random();
console.log("realod called", ev.data, reloadPath); console.log("realod called", ev.data, reloadPath);
const reImport = await import(reloadPath); const reImport = await import(reloadPath);
FileListeners.get(ev.data)?.forEach(h => h(reImport)); FileListeners.get(ev.data)?.forEach(h => h(reImport));

View File

@ -114,12 +114,12 @@ export const ModuleShape =(inText:string)=>
return[local, foreign] as [local:string[], foreign:string[]]; return[local, foreign] as [local:string[], foreign:string[]];
}; };
export const ModuleProxy =(inText:string, inPath:string, reactProxy:string)=> export const ModuleProxy =(inText:string, inPath:string, reactProxy:string, reloadKey:string)=>
{ {
const [local, foreign] = ModuleShape(inText); const [local, foreign] = ModuleShape(inText);
return ` return `
import {FileListen} from "${reactProxy}"; import {FileListen} from "${reactProxy}";
import * as Import from "${inPath}?reload=${new Date().getTime()}"; import * as Import from "${inPath}?${reloadKey}=${new Date().getTime()}";
${ local.map(m=>`let proxy_${m} = Import.${m}; export { proxy_${m} as ${m} };`).join("\n") } ${ local.map(m=>`let proxy_${m} = Import.${m}; export { proxy_${m} as ${m} };`).join("\n") }
FileListen("${inPath}", (updatedModule)=> FileListen("${inPath}", (updatedModule)=>
{ {

View File

@ -3,7 +3,7 @@ import { ModuleProxy } from "./hmr/hmr-static.tsx";
const keyBundle = "=>"; const keyBundle = "=>";
const keyTranspile = "->"; const keyTranspile = "->";
const keyReload = "reload"; const keyReload = "hmr:id";
const keysExtension = ["ts", "tsx"]; const keysExtension = ["ts", "tsx"];
const extractExtension =(path:string)=> const extractExtension =(path:string)=>
{ {
@ -59,7 +59,7 @@ async function BakeForce(options:FullBakeConfig)
{ {
const body = result.outputFiles.map(file=>file.text()).join("\n"); const body = result.outputFiles.map(file=>file.text()).join("\n");
const listenerImport = `/${keyTranspile}/${import.meta.resolve("./hmr/hmr-listen.tsx")}`; const listenerImport = `/${keyTranspile}/${import.meta.resolve("./hmr/hmr-listen.tsx")}`;
const save:CachedTranspile = [body, type ? "" : ModuleProxy(body, path, listenerImport)]; const save:CachedTranspile = [body, type ? "" : ModuleProxy(body, path, listenerImport, keyReload)];
BakeCache[key] = save; // replace promise with resolved value BakeCache[key] = save; // replace promise with resolved value
return save; return save;
} }
@ -183,13 +183,16 @@ Deno.serve(async(req:Request)=>
if(parts[0] == keyTranspile) if(parts[0] == keyTranspile)
{ {
console.log("TRANSPILE", parts); console.log("TRANSPILE", parts);
const transpiled = await BakeCheck({path:parts.slice(1).join("/"), bundle:false}); const transpiled = await BakeCheck({
path:parts.slice(1).join("/"),
bundle:false
});
return JSResponse(transpiled[0]); return JSResponse(transpiled[0]);
} }
if(keysExtension.includes(extension)) if(keysExtension.includes(extension))
{ {
console.log("REGULAR", parts); console.log("REGULAR", parts);
const transpiled = await BakeCheck({path:"."+url.pathname, bundle:false}); const transpiled = await BakeCheck({path:"./"+parts.join("/"), bundle:false});
//return JSResponse(transpiled[0]); //return JSResponse(transpiled[0]);
return JSResponse(transpiled[url.searchParams.has(keyReload) ? 0 : 1]); return JSResponse(transpiled[url.searchParams.has(keyReload) ? 0 : 1]);
} }