refactor(dev): revert serving assets from dev server (#6306)

remix-run · May 4, 2023 · 0b6bc2c · 0b6bc2c
1 parent 6563a94
commit 0b6bc2c
Show file tree

Hide file tree

Showing 6 changed files with 3 additions and 61 deletions.
diff --git a/.changeset/ninety-flies-allow.md b/.changeset/ninety-flies-allow.md
diff --git a/packages/remix-dev/__tests__/cli-test.ts b/packages/remix-dev/__tests__/cli-test.ts
@@ -122,7 +122,6 @@ describe("remix CLI", () => {
             --http-host         HTTP(S) host for the dev server. Default: localhost
             --http-port         HTTP(S) port for the dev server. Default: any open port
             --no-restart        Do not restart the app server when rebuilds occur.
-            --public-directory  Path to public assets directory relative to Remix project root. Default: public
             --websocket-port    Websocket port for the dev server. Default: any open port
           \`init\` Options:
             --no-delete         Skip deleting the \`remix.init\` script

diff --git a/packages/remix-dev/cli/commands.ts b/packages/remix-dev/cli/commands.ts
@@ -224,7 +224,6 @@ export async function dev(
     httpHost?: string;
     httpPort?: number;
     restart?: boolean;
-    publicDirectory?: string;
     websocketPort?: number;
   } = {}
 ) {
@@ -516,7 +515,6 @@ let resolveDevBuild = async (
 
 type DevServeFlags = DevBuildFlags & {
   command: string;
-  publicDirectory: string;
   restart: boolean;
 };
 let resolveDevServe = async (
@@ -555,11 +553,6 @@ let resolveDevServe = async (
     }
   }
 
-  let publicDirectory =
-    flags.publicDirectory ??
-    (dev === true ? undefined : dev.publicDirectory) ??
-    "public";
-
   let restart =
     flags.restart ?? (dev === true ? undefined : dev.restart) ?? true;
 
@@ -568,7 +561,6 @@ let resolveDevServe = async (
     httpScheme,
     httpHost,
     httpPort,
-    publicDirectory,
     websocketPort,
     restart,
   };

diff --git a/packages/remix-dev/cli/run.ts b/packages/remix-dev/cli/run.ts
@@ -48,7 +48,6 @@ ${colors.logoBlue("R")} ${colors.logoGreen("E")} ${colors.logoYellow(
     --http-host         HTTP(S) host for the dev server. Default: localhost
     --http-port         HTTP(S) port for the dev server. Default: any open port
     --no-restart        Do not restart the app server when rebuilds occur.
-    --public-directory  Path to public assets directory relative to Remix project root. Default: public
     --websocket-port    Websocket port for the dev server. Default: any open port
   \`init\` Options:
     --no-delete         Skip deleting the \`remix.init\` script
@@ -189,7 +188,6 @@ export async function run(argv: string[] = process.argv.slice(2)) {
       "--http-host": String,
       "--http-port": Number,
       "--no-restart": Boolean,
-      "--public-directory": String,
       "--websocket-port": Number,
     },
     {
@@ -227,10 +225,6 @@ export async function run(argv: string[] = process.argv.slice(2)) {
     flags.httpPort = flags["http-port"];
     delete flags["http-port"];
   }
-  if (flags["public-directory"]) {
-    flags.publicDirectory = flags["public-directory"];
-    delete flags["public-directory"];
-  }
   if (flags["websocket-port"]) {
     flags.websocketPort = flags["websocket-port"];
     delete flags["websocket-port"];

diff --git a/packages/remix-dev/compiler/js/compiler.ts b/packages/remix-dev/compiler/js/compiler.ts
@@ -202,11 +202,7 @@ const createEsbuildConfig = (
     platform: "browser",
     format: "esm",
     external: getExternals(ctx.config),
-    loader: {
-      ...loaders,
-      // in development, use dataurls for svgs so that `<use href={mysvg} />` works across different origins
-      ".svg": ctx.options.mode === "development" ? "dataurl" : loaders[".svg"],
-    },
+    loader: loaders,
     bundle: true,
     logLevel: "silent",
     splitting: true,

diff --git a/packages/remix-dev/devServer_unstable/index.ts b/packages/remix-dev/devServer_unstable/index.ts
@@ -8,7 +8,7 @@ import express from "express";
 import * as Channel from "../channel";
 import { type Manifest } from "../manifest";
 import * as Compiler from "../compiler";
-import { readConfig, type RemixConfig } from "../config";
+import { type RemixConfig } from "../config";
 import { loadEnv } from "./env";
 import * as Socket from "./socket";
 import * as HMR from "./hmr";
@@ -23,19 +23,6 @@ type Origin = {
 
 let stringifyOrigin = (o: Origin) => `${o.scheme}://${o.host}:${o.port}`;
 
-let patchPublicPath = (
-  config: RemixConfig,
-  devHttpOrigin: Origin
-): RemixConfig => {
-  // set public path to point to dev server
-  // so that browser asks the dev server for assets
-  return {
-    ...config,
-    // dev server has its own origin, to `/build/` path will not cause conflicts with app server routes
-    publicPath: stringifyOrigin(devHttpOrigin) + "/build/",
-  };
-};
-
 let detectBin = async (): Promise<string> => {
   let pkgManager = detectPackageManager() ?? "npm";
   if (pkgManager === "npm") {
@@ -54,7 +41,6 @@ export let serve = async (
     httpScheme: string;
     httpHost: string;
     httpPort: number;
-    publicDirectory: string;
     websocketPort: number;
     restart: boolean;
   }
@@ -119,7 +105,7 @@ export let serve = async (
 
   let dispose = await Compiler.watch(
     {
-      config: patchPublicPath(initialConfig, httpOrigin),
+      config: initialConfig,
       options: {
         mode: "development",
         sourcemap: true,
@@ -129,10 +115,6 @@ export let serve = async (
       },
     },
     {
-      reloadConfig: async (root) => {
-        let config = await readConfig(root);
-        return patchPublicPath(config, httpOrigin);
-      },
       onBuildStart: (ctx) => {
         state.appReady?.err();
         clean(ctx.config);
@@ -191,20 +173,6 @@ export let serve = async (
   );
 
   let httpServer = express()
-    // statically serve built assets
-    .use((_, res, next) => {
-      res.header("Access-Control-Allow-Origin", "*");
-      next();
-    })
-    .use(
-      "/build",
-      express.static(initialConfig.assetsBuildDirectory, {
-        immutable: true,
-        maxAge: "1y",
-      })
-    )
-    .use(express.static(options.publicDirectory, { maxAge: "1h" }))
-
     // handle `broadcastDevReady` messages
     .use(express.json())
     .post("/ping", (req, res) => {