wip

packages/remix-dev/compiler/compiler.ts

@@ -1,12 +1,10 @@
 import * as path from "path";
-import type esbuild from "esbuild";
 
 import type { Context } from "./context";
 import * as CSS from "./css";
 import * as JS from "./js";
 import * as Server from "./server";
 import * as Channel from "../channel";
-import * as HMR from "./hmr/compiler";
 import type { Manifest } from "../manifest";
 import { create as createManifest, write as writeManifest } from "./manifest";
 import { err, ok } from "../result";
@@ -33,11 +31,7 @@ export let create = async (ctx: Context): Promise<Compiler> => {
     css: await CSS.createCompiler(ctx),
     js: await JS.createCompiler(ctx, channels),
     server: await Server.createCompiler(ctx, channels),
-    hmr: undefined as esbuild.BuildContext | undefined,
   };
-  if (ctx.options.mode === "development") {
-    subcompiler.hmr = await HMR.create(ctx);
-  }
   let cancel = async () => {
     // resolve channels with error so that downstream tasks don't hang waiting for results from upstream tasks
     channels.cssBundleHref.err();
@@ -72,7 +66,6 @@ export let create = async (ctx: Context): Promise<Compiler> => {
       css: subcompiler.css.compile().then(ok, errCancel),
       js: subcompiler.js.compile().then(ok, errCancel),
       server: subcompiler.server.compile().then(ok, errCancel),
-      hmr: subcompiler.hmr?.rebuild().then(ok, errCancel),
     };
 
     // keep track of manually written artifacts
@@ -100,7 +93,6 @@ export let create = async (ctx: Context): Promise<Compiler> => {
     }
 
     // js compilation (implicitly writes artifacts/js)
-    // TODO: js task should not return metafile, but rather js assets
     let js = await tasks.js;
     if (!js.ok) throw error ?? js.error;
     let { metafile, hmr } = js.value;
@@ -122,13 +114,6 @@ export let create = async (ctx: Context): Promise<Compiler> => {
     // artifacts/server
     writes.server = Server.write(ctx.config, server.value);
 
-    if (ctx.options.mode === "development" && tasks.hmr) {
-      let hmr = await tasks.hmr;
-      if (!hmr.ok) throw hmr.error;
-      console.log("HMR_RESULTS:");
-      console.log(hmr.value.metafile?.outputs);
-    }
-
     await Promise.all(Object.values(writes));
     return manifest;
   };

packages/remix-dev/compiler/watch.ts

@@ -45,11 +45,12 @@ export async function watch(
 ): Promise<() => Promise<void>> {
   let start = Date.now();
   let compiler = await Compiler.create(ctx);
-  let compile = () =>
-    compiler.compile({ onManifest: onBuildManifest }).catch((thrown) => {
+  let compile = async () => {
+    await compiler.compile({ onManifest: onBuildManifest }).catch((thrown) => {
       logThrown(thrown);
       return undefined;
     });
+  };
 
   // initial build
   onBuildStart?.(ctx);

packages/remix-dev/compiler/hmr/compiler.ts → packages/remix-dev/devServer_unstable/hdr.ts

@@ -1,20 +1,20 @@
 import * as path from "node:path";
 import esbuild from "esbuild";
 
-import type { Context } from "../context";
-import { externalPlugin } from "../plugins/external";
-import { emptyModulesPlugin } from "../plugins/emptyModules";
-import { createMatchPath } from "../utils/tsconfig";
-import invariant from "../../invariant";
-import { getRouteModuleExports } from "../utils/routeExports";
+import type { Context } from "../compiler/context";
+import { emptyModulesPlugin } from "../compiler/plugins/emptyModules";
+import { externalPlugin } from "../compiler/plugins/external";
+import { getRouteModuleExports } from "../compiler/utils/routeExports";
+import { createMatchPath } from "../compiler/utils/tsconfig";
+import invariant from "../invariant";
 
 function isBareModuleId(id: string): boolean {
   return !id.startsWith("node:") && !id.startsWith(".") && !path.isAbsolute(id);
 }
 
 type Route = Context["config"]["routes"][string];
 
-export let create = async (ctx: Context) => {
+export let create = async (ctx: Context): Promise<esbuild.BuildContext> => {
   let entryPoints: Record<string, string> = {};
   for (let id of Object.keys(ctx.config.routes)) {
     entryPoints[id] = ctx.config.routes[id].file + "?loader";
@@ -26,7 +26,7 @@ export let create = async (ctx: Context) => {
     metafile: true,
     outdir: "blah",
     write: false,
-    entryNames: "[dir]/[name]-[hash]",
+    entryNames: "[hash]:[dir]/[name]",
     plugins: [
       {
         name: "hmr-loader",
@@ -93,6 +93,4 @@ export let create = async (ctx: Context) => {
     ],
   });
   return compiler;
-  // let result = await compiler.rebuild();
-  // console.log(result.metafile.outputs);
 };

packages/remix-dev/devServer_unstable/index.ts

@@ -119,11 +119,15 @@ export let serve = async (
         state.appReady?.err();
         clean(ctx.config);
         websocket.log(state.prevManifest ? "Rebuilding..." : "Building...");
+        // todo: make ctx the new ctx
+        // if ctx !== old ctx: hdr.dispose() && hdr = HDR.create(ctx)
+        // state.hdr.rebuild()
       },
       onBuildManifest: (manifest: Manifest) => {
         state.manifest = manifest;
       },
       onBuildFinish: async (ctx, durationMs, succeeded) => {
+        // if !succeed: state.hdr.cancel()
         if (!succeeded) return;
 
         websocket.log(
@@ -142,10 +146,12 @@ export let serve = async (
           state.appServer = startAppServer(options.command);
         }
         let { ok } = await state.appReady.result;
+        // if !ok: state.hdr.cancel()
         // result not ok -> new build started before this one finished. do not process outdated manifest
         if (ok) {
           console.log(`App server took ${prettyMs(Date.now() - start)}`);
 
+          // let hdr = await state.hdr
           if (state.manifest?.hmr && state.prevManifest) {
             let updates = HMR.updates(
               ctx.config,