Merge branch 'dev' into markdalgleish/remove-v1-route-convention

remix-run · Jul 30, 2023 · 6940b12 · 6940b12
2 parents 14f1ee8 + 1e19750
commit 6940b12
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 22 deletions.
diff --git a/.changeset/decouple-css-bundle-from-dev.md b/.changeset/decouple-css-bundle-from-dev.md
@@ -0,0 +1,7 @@
+---
+"@remix-run/css-bundle": patch
+"@remix-run/dev": patch
+---
+Decouple the `@remix-run/dev` package from the contents of the `@remix-run/css-bundle` package.
+
+The contents of the `@remix-run/css-bundle` package are now entirely managed by the Remix compiler. Even though it's still recommended that your Remix dependencies all share the same version, this change ensures that there are no runtime errors when upgrading `@remix-run/dev` without upgrading `@remix-run/css-bundle`.
diff --git a/packages/create-remix/package.json b/packages/create-remix/package.json
@@ -35,10 +35,11 @@
     "@types/gunzip-maybe": "^1.4.0",
     "@types/node-fetch": "^2.5.7",
     "@types/tar-fs": "^2.0.1",
+    "esbuild": "0.17.6",
+    "esbuild-register": "^3.3.2",
     "fs-extra": "^10.0.0",
     "msw": "^0.39.2",
-    "tiny-invariant": "^1.2.0",
-    "esbuild-register": "^3.3.2"
+    "tiny-invariant": "^1.2.0"
   },
   "engines": {
     "node": ">=14.0.0"

diff --git a/packages/remix-css-bundle/index.ts b/packages/remix-css-bundle/index.ts
@@ -1,9 +1,4 @@
-declare const __INJECT_CSS_BUNDLE_HREF__: string | undefined;
-
-// Injected by `cssBundlePlugin`
-let cssBundleHref: string | undefined =
-  typeof __INJECT_CSS_BUNDLE_HREF__ === "string"
-    ? __INJECT_CSS_BUNDLE_HREF__
-    : undefined;
-
-export { cssBundleHref };
+// This file's contents are replaced by `cssBundlePlugin`. This file only exists
+// to provide type definitions and a graceful fallback when importing this
+// package outside of the Remix compiler.
+export const cssBundleHref: string | undefined = undefined;
diff --git a/packages/remix-dev/compiler/plugins/cssBundlePlugin.ts b/packages/remix-dev/compiler/plugins/cssBundlePlugin.ts
@@ -1,9 +1,8 @@
 import type { Plugin } from "esbuild";
-import { readFile } from "fs-extra";
 
 import type { LazyValue } from "../lazyValue";
 
-const pluginName = "css-bundle-update-plugin";
+const pluginName = "css-bundle-plugin";
 const namespace = `${pluginName}-ns`;
 
 /**
@@ -38,19 +37,14 @@ export function cssBundlePlugin(refs: {
         };
       });
 
-      build.onLoad({ filter: /.*/, namespace }, async (args) => {
+      build.onLoad({ filter: /.*/, namespace }, async () => {
         let cssBundleHref = await refs.lazyCssBundleHref.get();
 
-        let contents = await readFile(args.path, "utf8");
-
-        contents = contents.replace(
-          /__INJECT_CSS_BUNDLE_HREF__/g,
-          cssBundleHref ? JSON.stringify(cssBundleHref) : "undefined"
-        );
-
         return {
           loader: "js",
-          contents,
+          contents: `export const cssBundleHref = ${
+            cssBundleHref ? JSON.stringify(cssBundleHref) : "undefined"
+          };`,
         };
       });
     },