fix: css bundling failing on non-node platforms (#6238)

remix-run · May 1, 2023 · 37bb7a7 · 37bb7a7
1 parent 34f9b89
commit 37bb7a7
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 6 deletions.
diff --git a/.changeset/css-import-non-node-fix.md b/.changeset/css-import-non-node-fix.md
@@ -0,0 +1,5 @@
+---
+"@remix-run/dev": patch
+---
+
+don't forward on injects for CSS compiler as it's never loading any JS code and esbuild seems to have a bug with CSS entries + inject
diff --git a/packages/remix-dev/compiler/plugins/cssImports.ts b/packages/remix-dev/compiler/plugins/cssImports.ts
@@ -30,26 +30,56 @@ export function cssFilePlugin({
     name: "css-file",
 
     async setup(build) {
-      let buildOps = build.initialOptions;
+      let {
+        absWorkingDir,
+        assetNames,
+        chunkNames,
+        conditions,
+        define,
+        external,
+        sourceRoot,
+        treeShaking,
+        tsconfig,
+        format,
+        loader,
+        mainFields,
+        nodePaths,
+        platform,
+        publicPath,
+        target,
+      } = build.initialOptions;
 
       let postcssProcessor = await getPostcssProcessor({ config });
 
       build.onLoad({ filter: /\.css$/ }, async (args) => {
         let { metafile, outputFiles, warnings, errors } = await esbuild.build({
-          ...buildOps,
+          absWorkingDir,
+          assetNames,
+          chunkNames,
+          conditions,
+          define,
+          external,
+          format,
+          mainFields,
+          nodePaths,
+          platform,
+          publicPath,
+          sourceRoot,
+          target,
+          treeShaking,
+          tsconfig,
           minify: options.mode === "production",
+          bundle: true,
           minifySyntax: true,
           metafile: true,
           write: false,
           sourcemap: Boolean(options.sourcemap && postcssProcessor), // We only need source maps if we're processing the CSS with PostCSS
           splitting: false,
-          stdin: undefined,
-          outfile: undefined,
           outdir: config.assetsBuildDirectory,
-          entryNames: buildOps.assetNames,
+          entryNames: assetNames,
           entryPoints: [args.path],
           loader: {
-            ...buildOps.loader,
+            ...loader,
             ".css": "css",
           },
           plugins: [