refactor(dev): simplify compiler (#4410)

* refactor(dev): rename getRouteModuleExportsCached to getRouteModuleExports

since caching is perf improvement that is purely an implementation detail.
also remove export for uncached route exports since that is not used
anywhere.

* refactor(dev): simplify build options

using string constant unions instead of enums

* refactor(dev): split up browser and server builds into their own modules

* refactor(dev): factor out logic for finding externals

* refactor(dev): compiler interfaces for browser and server

* refactor(dev): change server assets manifest plugin to accept an assets manifest promise

* refactor(dev): do not compile server incrementally

since it depends on the assets manifest

* refactor(dev): split up build and watch into separate modules

also, split out compile failure logging into its own module

* refactor(dev): implement `build` function based on new remix compiler

* refactor(dev): rename `BuildOptions` to `CompileOptions` and move into `compiler/` directory

* refactor(dev): watch

* refactor(dev): compiler index module

* refactor(dev): camelCase filenames

* refactor(dev): update imports and types for compiler in `commands`

* test(dev): fix type errors

* test(dev): remove outdated, unused test

test was hardcoded to be skipped everytime and referenced the old rollup-based compiler and old gist
app

* refactor(dev): rename `onBuildFailure` to `onCompileFailure`

packages/remix-dev/__tests__/cli-test.ts

@@ -28,7 +28,7 @@ afterAll(async () => {
 
 async function execRemix(
   args: Array<string>,
-  options: Parameters<typeof execFile>[2] = {}
+  options: Exclude<Parameters<typeof execFile>[2], null | undefined> = {}
 ) {
   if (process.platform === "win32") {
     let cp = childProcess.spawnSync(
@@ -275,7 +275,7 @@ function defer() {
       return rej(reason);
     };
   });
-  return { promise, resolve, reject, state };
+  return { promise, resolve: resolve!, reject: reject!, state };
 }
 
 async function interactWithShell(

packages/remix-dev/__tests__/routesConvention-test.ts

@@ -2,7 +2,7 @@ import { createRoutePath } from "../config/routesConvention";
 
 describe("createRoutePath", () => {
   describe("creates proper route paths", () => {
-    let tests = [
+    let tests: [string, string | undefined][] = [
       ["routes/$", "routes/*"],
       ["routes/sub/$", "routes/sub/*"],
       ["routes.sub/$", "routes/sub/*"],

packages/remix-dev/cli/commands.ts

@@ -12,7 +12,6 @@ import type { createApp as createAppType } from "@remix-run/serve";
 import getPort, { makeRange } from "get-port";
 import * as esbuild from "esbuild";
 
-import { BuildMode, isBuildMode } from "../build";
 import * as colors from "../colors";
 import * as compiler from "../compiler";
 import type { RemixConfig } from "../config";
@@ -148,11 +147,11 @@ export async function build(
   modeArg?: string,
   sourcemap: boolean = false
 ): Promise<void> {
-  let mode = isBuildMode(modeArg) ? modeArg : BuildMode.Production;
+  let mode = compiler.parseMode(modeArg ?? "", "production");
 
   log(`Building Remix app in ${mode} mode...`);
 
-  if (modeArg === BuildMode.Production && sourcemap) {
+  if (modeArg === "production" && sourcemap) {
     console.warn(
       "\n⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️"
     );
@@ -171,10 +170,10 @@ export async function build(
   let config = await readConfig(remixRoot);
   fse.emptyDirSync(config.assetsBuildDirectory);
   await compiler.build(config, {
-    mode: mode,
+    mode,
     sourcemap,
-    onBuildFailure: (failure: compiler.BuildError) => {
-      compiler.formatBuildFailure(failure);
+    onCompileFailure: (failure) => {
+      compiler.logCompileFailure(failure);
       throw Error();
     },
   });
@@ -193,7 +192,7 @@ export async function watch(
   callbacks?: WatchCallbacks
 ): Promise<void> {
   let { onInitialBuild, onRebuildStart } = callbacks || {};
-  let mode = isBuildMode(modeArg) ? modeArg : BuildMode.Development;
+  let mode = compiler.parseMode(modeArg ?? "", "development");
   console.log(`Watching Remix app in ${mode} mode...`);
 
   let start = Date.now();
@@ -278,7 +277,7 @@ export async function dev(
   }
 
   let config = await readConfig(remixRoot);
-  let mode = isBuildMode(modeArg) ? modeArg : BuildMode.Development;
+  let mode = compiler.parseMode(modeArg ?? "", "development");
 
   await loadEnv(config.rootDirectory);