@vanilla-extract/vite-plugin 5.2.3-vite-environment-20260407054241 → 5.2.4

package/dist/vanilla-extract-vite-plugin.cjs.dev.js

@@ -2,13 +2,47 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var path = require('path');
 var compiler = require('@vanilla-extract/compiler');
 var integration = require('@vanilla-extract/integration');
+var path = require('path');
+
+// Vite wraps module ids that aren't valid browser import specifiers with
+// `/@id/` in dev mode. The leading slash is sometimes already stripped.
+const viteIdPrefix = /^\/?@id\//;
+// Vite emits posix separators and sometimes prefixes a Windows drive letter
+// with a slash, e.g. a resolved id like `/C:/...`.
+const slashPrefixedDrive = /^\/([a-zA-Z]:\/)/;
+// A Windows drive path (`C:/...`) is unambiguously a real absolute path
+// unlike a posix `/...` path, which may be an SSR root-relative id.
+const windowsAbsolutePathRegex = /^[a-zA-Z]:\//;
+const isWindowsAbsolutePath = filePath => windowsAbsolutePathRegex.test(filePath);
+const isAbsolutePath = filePath => path.posix.isAbsolute(filePath) || isWindowsAbsolutePath(filePath);
+
+// Strip Vite's `@id/` wrapper and any slash it prefixes onto a Windows drive.
+const unwrapViteId = id => {
+  const unwrapped = id.replace(viteIdPrefix, '').replace(slashPrefixedDrive, '$1');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+  // If unwrapping didn't yield an absolute path, the `@id/` prefix wasn't a
+  // path wrapper, so keep the original id.
+  return isAbsolutePath(unwrapped) ? unwrapped : id;
+};
+const getAbsoluteId = ({
+  filePath,
+  root
+}) => {
+  const resolvedId = unwrapViteId(filePath);
+  if (
+  // A Windows drive path is always a real absolute path.
+  isWindowsAbsolutePath(resolvedId) || resolvedId.startsWith(root) ||
+  // In monorepos the absolute path is outside of `root`, so we check they
+  // share a filesystem root. Vite paths always use posix separators.
+  path.posix.isAbsolute(resolvedId) && resolvedId.split(path.posix.sep)[1] === root.split(path.posix.sep)[1]) {
+    return integration.normalizePath(resolvedId);
+  }
 
-var path__default = /*#__PURE__*/_interopDefault(path);
+  // In SSR mode we can have root-relative paths like `/app/styles.css.ts`.
+  return integration.normalizePath(path.posix.join(root, resolvedId));
+};
 
 const PLUGIN_NAMESPACE = 'vite-plugin-vanilla-extract';
 const virtualExtCss = '.vanilla.css';
@@ -39,23 +73,11 @@ function vanillaExtractPlugin({
   let server;
   let packageName;
   let compiler$1;
+  let compilerReady;
   let isBuild;
   const vitePromise = import('vite');
   const transformedModules = new Set();
   const getIdentOption = () => identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
-  const getAbsoluteId = filePath => {
-    let resolvedId = filePath;
-    if (filePath.startsWith(config.root) ||
-    // In monorepos the absolute path will be outside of config.root, so we check that they have the same root on the file system
-    // Paths from vite are always normalized, so we have to use the posix path separator
-    path__default["default"].isAbsolute(filePath) && filePath.split(path__default["default"].posix.sep)[1] === config.root.split(path__default["default"].posix.sep)[1]) {
-      resolvedId = filePath;
-    } else {
-      // In SSR mode we can have paths like /app/styles.css.ts
-      resolvedId = path__default["default"].join(config.root, filePath);
-    }
-    return integration.normalizePath(resolvedId);
-  };
 
   /**
    * Custom invalidation function that takes a chain of importers to invalidate. If an importer is a
@@ -87,6 +109,60 @@ function vanillaExtractPlugin({
       }
     }
   };
+  const initializeCompiler = async () => {
+    var _configForViteCompile;
+    const {
+      loadConfigFromFile
+    } = await vitePromise;
+    let configForViteCompiler;
+
+    // The user has a vite config file
+    if (config.configFile) {
+      const configFile = await loadConfigFromFile({
+        command: config.command,
+        mode: config.mode,
+        isSsrBuild: configEnv.isSsrBuild
+      }, config.configFile);
+      configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
+    }
+    // The user is using a vite-based framework that has a custom config file
+    else {
+      configForViteCompiler = config.inlineConfig;
+    }
+    const viteConfig = {
+      ...configForViteCompiler,
+      plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
+        mode: config.mode,
+        pluginFilter
+      }))
+    };
+    compiler$1 = compiler.createCompiler({
+      root: config.root,
+      identifiers: getIdentOption(),
+      cssImportSpecifier: fileIdToVirtualId,
+      viteConfig,
+      enableFileWatcher: !isBuild
+    });
+  };
+
+  /**
+   * Lazily creates the compiler, memoizing the initialization promise.
+   *
+   * `buildStart` kicks this off eagerly, but `transform` also awaits it. This
+   * matters because `transform` can run before `buildStart` has finished
+   * creating the compiler when another plugin emits an additional entry whose
+   * module graph is transformed concurrently (e.g. a module federation plugin
+   * exposing a module as its own chunk). Without awaiting, `transform` would
+   * bail and leave the `.css.ts` untransformed, producing runtime `style()`
+   * calls that throw "Styles were unable to be assigned to a file".
+   */
+  const ensureCompiler = () => {
+    if (unstable_mode === 'transform') {
+      return Promise.resolve();
+    }
+    compilerReady ?? (compilerReady = initializeCompiler());
+    return compilerReady;
+  };
   return [{
     name: `${PLUGIN_NAMESPACE}-inline-dev-css`,
     apply: (_, {
@@ -131,41 +207,7 @@ function vanillaExtractPlugin({
     },
     async buildStart() {
       // Ensure we re-use the compiler instance between builds, e.g. in watch mode
-      if (unstable_mode !== 'transform' && !compiler$1) {
-        var _configForViteCompile;
-        const {
-          loadConfigFromFile
-        } = await vitePromise;
-        let configForViteCompiler;
-
-        // The user has a vite config file
-        if (config.configFile) {
-          const configFile = await loadConfigFromFile({
-            command: config.command,
-            mode: config.mode,
-            isSsrBuild: configEnv.isSsrBuild
-          }, config.configFile);
-          configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
-        }
-        // The user is using a vite-based framework that has a custom config file
-        else {
-          configForViteCompiler = config.inlineConfig;
-        }
-        const viteConfig = {
-          ...configForViteCompiler,
-          plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
-            mode: config.mode,
-            pluginFilter
-          }))
-        };
-        compiler$1 = compiler.createCompiler({
-          root: config.root,
-          identifiers: getIdentOption(),
-          cssImportSpecifier: fileIdToVirtualId,
-          viteConfig,
-          enableFileWatcher: !isBuild
-        });
-      }
+      await ensureCompiler();
     },
     buildEnd() {
       // When using the rollup watcher, we don't want to close the compiler after every build.
@@ -196,10 +238,21 @@ function vanillaExtractPlugin({
           identOption
         });
       }
+
+      // `transform` can run before `buildStart` has finished creating the
+      // compiler (e.g. when another plugin emits an additional entry whose
+      // module graph is transformed concurrently). Await the memoized
+      // initialization rather than bailing, which would leave this `.css.ts`
+      // untransformed. `ensureCompiler` is memoized, so this is a no-op once
+      // the compiler exists.
+      await ensureCompiler();
       if (!compiler$1) {
         return null;
       }
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         source,
         watchFiles
@@ -246,14 +299,21 @@ function vanillaExtractPlugin({
       });
     },
     resolveId(source) {
-      var _compiler4;
       const [validId, query] = source.split('?');
       if (!isVirtualId(validId)) return;
-      const absoluteId = getAbsoluteId(validId);
-      if ( // We should always have CSS for a file here.
-      // The only valid scenario for a missing one is if someone had written
-      // a file in their app using the .vanilla.js/.vanilla.css extension
-      (_compiler4 = compiler$1) !== null && _compiler4 !== void 0 && _compiler4.getCssForFile(virtualIdToFileId(absoluteId))) {
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
+      if (!compiler$1) return;
+
+      // The only valid scenario for a missing CSS entry is if someone had
+      // written a file in their app using the .vanilla.js/.vanilla.css
+      // extension, or the file produced no CSS output.
+      const {
+        css
+      } = compiler$1.getCssForFile(virtualIdToFileId(absoluteId));
+      if (css) {
         // Keep the original query string for HMR.
         return absoluteId + (query ? `?${query}` : '');
       }
@@ -261,11 +321,16 @@ function vanillaExtractPlugin({
     load(id) {
       const [validId] = id.split('?');
       if (!isVirtualId(validId) || !compiler$1) return;
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         css
       } = compiler$1.getCssForFile(virtualIdToFileId(absoluteId));
-      return css;
+      if (css) {
+        return css;
+      }
     }
   }];
 }

package/dist/vanilla-extract-vite-plugin.cjs.prod.js

@@ -2,13 +2,47 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var path = require('path');
 var compiler = require('@vanilla-extract/compiler');
 var integration = require('@vanilla-extract/integration');
+var path = require('path');
+
+// Vite wraps module ids that aren't valid browser import specifiers with
+// `/@id/` in dev mode. The leading slash is sometimes already stripped.
+const viteIdPrefix = /^\/?@id\//;
+// Vite emits posix separators and sometimes prefixes a Windows drive letter
+// with a slash, e.g. a resolved id like `/C:/...`.
+const slashPrefixedDrive = /^\/([a-zA-Z]:\/)/;
+// A Windows drive path (`C:/...`) is unambiguously a real absolute path
+// unlike a posix `/...` path, which may be an SSR root-relative id.
+const windowsAbsolutePathRegex = /^[a-zA-Z]:\//;
+const isWindowsAbsolutePath = filePath => windowsAbsolutePathRegex.test(filePath);
+const isAbsolutePath = filePath => path.posix.isAbsolute(filePath) || isWindowsAbsolutePath(filePath);
+
+// Strip Vite's `@id/` wrapper and any slash it prefixes onto a Windows drive.
+const unwrapViteId = id => {
+  const unwrapped = id.replace(viteIdPrefix, '').replace(slashPrefixedDrive, '$1');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+  // If unwrapping didn't yield an absolute path, the `@id/` prefix wasn't a
+  // path wrapper, so keep the original id.
+  return isAbsolutePath(unwrapped) ? unwrapped : id;
+};
+const getAbsoluteId = ({
+  filePath,
+  root
+}) => {
+  const resolvedId = unwrapViteId(filePath);
+  if (
+  // A Windows drive path is always a real absolute path.
+  isWindowsAbsolutePath(resolvedId) || resolvedId.startsWith(root) ||
+  // In monorepos the absolute path is outside of `root`, so we check they
+  // share a filesystem root. Vite paths always use posix separators.
+  path.posix.isAbsolute(resolvedId) && resolvedId.split(path.posix.sep)[1] === root.split(path.posix.sep)[1]) {
+    return integration.normalizePath(resolvedId);
+  }
 
-var path__default = /*#__PURE__*/_interopDefault(path);
+  // In SSR mode we can have root-relative paths like `/app/styles.css.ts`.
+  return integration.normalizePath(path.posix.join(root, resolvedId));
+};
 
 const PLUGIN_NAMESPACE = 'vite-plugin-vanilla-extract';
 const virtualExtCss = '.vanilla.css';
@@ -39,23 +73,11 @@ function vanillaExtractPlugin({
   let server;
   let packageName;
   let compiler$1;
+  let compilerReady;
   let isBuild;
   const vitePromise = import('vite');
   const transformedModules = new Set();
   const getIdentOption = () => identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
-  const getAbsoluteId = filePath => {
-    let resolvedId = filePath;
-    if (filePath.startsWith(config.root) ||
-    // In monorepos the absolute path will be outside of config.root, so we check that they have the same root on the file system
-    // Paths from vite are always normalized, so we have to use the posix path separator
-    path__default["default"].isAbsolute(filePath) && filePath.split(path__default["default"].posix.sep)[1] === config.root.split(path__default["default"].posix.sep)[1]) {
-      resolvedId = filePath;
-    } else {
-      // In SSR mode we can have paths like /app/styles.css.ts
-      resolvedId = path__default["default"].join(config.root, filePath);
-    }
-    return integration.normalizePath(resolvedId);
-  };
 
   /**
    * Custom invalidation function that takes a chain of importers to invalidate. If an importer is a
@@ -87,6 +109,60 @@ function vanillaExtractPlugin({
       }
     }
   };
+  const initializeCompiler = async () => {
+    var _configForViteCompile;
+    const {
+      loadConfigFromFile
+    } = await vitePromise;
+    let configForViteCompiler;
+
+    // The user has a vite config file
+    if (config.configFile) {
+      const configFile = await loadConfigFromFile({
+        command: config.command,
+        mode: config.mode,
+        isSsrBuild: configEnv.isSsrBuild
+      }, config.configFile);
+      configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
+    }
+    // The user is using a vite-based framework that has a custom config file
+    else {
+      configForViteCompiler = config.inlineConfig;
+    }
+    const viteConfig = {
+      ...configForViteCompiler,
+      plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
+        mode: config.mode,
+        pluginFilter
+      }))
+    };
+    compiler$1 = compiler.createCompiler({
+      root: config.root,
+      identifiers: getIdentOption(),
+      cssImportSpecifier: fileIdToVirtualId,
+      viteConfig,
+      enableFileWatcher: !isBuild
+    });
+  };
+
+  /**
+   * Lazily creates the compiler, memoizing the initialization promise.
+   *
+   * `buildStart` kicks this off eagerly, but `transform` also awaits it. This
+   * matters because `transform` can run before `buildStart` has finished
+   * creating the compiler when another plugin emits an additional entry whose
+   * module graph is transformed concurrently (e.g. a module federation plugin
+   * exposing a module as its own chunk). Without awaiting, `transform` would
+   * bail and leave the `.css.ts` untransformed, producing runtime `style()`
+   * calls that throw "Styles were unable to be assigned to a file".
+   */
+  const ensureCompiler = () => {
+    if (unstable_mode === 'transform') {
+      return Promise.resolve();
+    }
+    compilerReady ?? (compilerReady = initializeCompiler());
+    return compilerReady;
+  };
   return [{
     name: `${PLUGIN_NAMESPACE}-inline-dev-css`,
     apply: (_, {
@@ -131,41 +207,7 @@ function vanillaExtractPlugin({
     },
     async buildStart() {
       // Ensure we re-use the compiler instance between builds, e.g. in watch mode
-      if (unstable_mode !== 'transform' && !compiler$1) {
-        var _configForViteCompile;
-        const {
-          loadConfigFromFile
-        } = await vitePromise;
-        let configForViteCompiler;
-
-        // The user has a vite config file
-        if (config.configFile) {
-          const configFile = await loadConfigFromFile({
-            command: config.command,
-            mode: config.mode,
-            isSsrBuild: configEnv.isSsrBuild
-          }, config.configFile);
-          configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
-        }
-        // The user is using a vite-based framework that has a custom config file
-        else {
-          configForViteCompiler = config.inlineConfig;
-        }
-        const viteConfig = {
-          ...configForViteCompiler,
-          plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
-            mode: config.mode,
-            pluginFilter
-          }))
-        };
-        compiler$1 = compiler.createCompiler({
-          root: config.root,
-          identifiers: getIdentOption(),
-          cssImportSpecifier: fileIdToVirtualId,
-          viteConfig,
-          enableFileWatcher: !isBuild
-        });
-      }
+      await ensureCompiler();
     },
     buildEnd() {
       // When using the rollup watcher, we don't want to close the compiler after every build.
@@ -196,10 +238,21 @@ function vanillaExtractPlugin({
           identOption
         });
       }
+
+      // `transform` can run before `buildStart` has finished creating the
+      // compiler (e.g. when another plugin emits an additional entry whose
+      // module graph is transformed concurrently). Await the memoized
+      // initialization rather than bailing, which would leave this `.css.ts`
+      // untransformed. `ensureCompiler` is memoized, so this is a no-op once
+      // the compiler exists.
+      await ensureCompiler();
       if (!compiler$1) {
         return null;
       }
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         source,
         watchFiles
@@ -246,14 +299,21 @@ function vanillaExtractPlugin({
       });
     },
     resolveId(source) {
-      var _compiler4;
       const [validId, query] = source.split('?');
       if (!isVirtualId(validId)) return;
-      const absoluteId = getAbsoluteId(validId);
-      if ( // We should always have CSS for a file here.
-      // The only valid scenario for a missing one is if someone had written
-      // a file in their app using the .vanilla.js/.vanilla.css extension
-      (_compiler4 = compiler$1) !== null && _compiler4 !== void 0 && _compiler4.getCssForFile(virtualIdToFileId(absoluteId))) {
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
+      if (!compiler$1) return;
+
+      // The only valid scenario for a missing CSS entry is if someone had
+      // written a file in their app using the .vanilla.js/.vanilla.css
+      // extension, or the file produced no CSS output.
+      const {
+        css
+      } = compiler$1.getCssForFile(virtualIdToFileId(absoluteId));
+      if (css) {
         // Keep the original query string for HMR.
         return absoluteId + (query ? `?${query}` : '');
       }
@@ -261,11 +321,16 @@ function vanillaExtractPlugin({
     load(id) {
       const [validId] = id.split('?');
       if (!isVirtualId(validId) || !compiler$1) return;
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         css
       } = compiler$1.getCssForFile(virtualIdToFileId(absoluteId));
-      return css;
+      if (css) {
+        return css;
+      }
     }
   }];
 }

package/dist/vanilla-extract-vite-plugin.esm.js

@@ -1,6 +1,44 @@
-import path from 'path';
 import { createCompiler } from '@vanilla-extract/compiler';
 import { normalizePath, getPackageInfo, cssFileFilter, transform } from '@vanilla-extract/integration';
+import { posix } from 'path';
+
+// Vite wraps module ids that aren't valid browser import specifiers with
+// `/@id/` in dev mode. The leading slash is sometimes already stripped.
+const viteIdPrefix = /^\/?@id\//;
+// Vite emits posix separators and sometimes prefixes a Windows drive letter
+// with a slash, e.g. a resolved id like `/C:/...`.
+const slashPrefixedDrive = /^\/([a-zA-Z]:\/)/;
+// A Windows drive path (`C:/...`) is unambiguously a real absolute path
+// unlike a posix `/...` path, which may be an SSR root-relative id.
+const windowsAbsolutePathRegex = /^[a-zA-Z]:\//;
+const isWindowsAbsolutePath = filePath => windowsAbsolutePathRegex.test(filePath);
+const isAbsolutePath = filePath => posix.isAbsolute(filePath) || isWindowsAbsolutePath(filePath);
+
+// Strip Vite's `@id/` wrapper and any slash it prefixes onto a Windows drive.
+const unwrapViteId = id => {
+  const unwrapped = id.replace(viteIdPrefix, '').replace(slashPrefixedDrive, '$1');
+
+  // If unwrapping didn't yield an absolute path, the `@id/` prefix wasn't a
+  // path wrapper, so keep the original id.
+  return isAbsolutePath(unwrapped) ? unwrapped : id;
+};
+const getAbsoluteId = ({
+  filePath,
+  root
+}) => {
+  const resolvedId = unwrapViteId(filePath);
+  if (
+  // A Windows drive path is always a real absolute path.
+  isWindowsAbsolutePath(resolvedId) || resolvedId.startsWith(root) ||
+  // In monorepos the absolute path is outside of `root`, so we check they
+  // share a filesystem root. Vite paths always use posix separators.
+  posix.isAbsolute(resolvedId) && resolvedId.split(posix.sep)[1] === root.split(posix.sep)[1]) {
+    return normalizePath(resolvedId);
+  }
+
+  // In SSR mode we can have root-relative paths like `/app/styles.css.ts`.
+  return normalizePath(posix.join(root, resolvedId));
+};
 
 const PLUGIN_NAMESPACE = 'vite-plugin-vanilla-extract';
 const virtualExtCss = '.vanilla.css';
@@ -31,23 +69,11 @@ function vanillaExtractPlugin({
   let server;
   let packageName;
   let compiler;
+  let compilerReady;
   let isBuild;
   const vitePromise = import('vite');
   const transformedModules = new Set();
   const getIdentOption = () => identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
-  const getAbsoluteId = filePath => {
-    let resolvedId = filePath;
-    if (filePath.startsWith(config.root) ||
-    // In monorepos the absolute path will be outside of config.root, so we check that they have the same root on the file system
-    // Paths from vite are always normalized, so we have to use the posix path separator
-    path.isAbsolute(filePath) && filePath.split(path.posix.sep)[1] === config.root.split(path.posix.sep)[1]) {
-      resolvedId = filePath;
-    } else {
-      // In SSR mode we can have paths like /app/styles.css.ts
-      resolvedId = path.join(config.root, filePath);
-    }
-    return normalizePath(resolvedId);
-  };
 
   /**
    * Custom invalidation function that takes a chain of importers to invalidate. If an importer is a
@@ -79,6 +105,60 @@ function vanillaExtractPlugin({
       }
     }
   };
+  const initializeCompiler = async () => {
+    var _configForViteCompile;
+    const {
+      loadConfigFromFile
+    } = await vitePromise;
+    let configForViteCompiler;
+
+    // The user has a vite config file
+    if (config.configFile) {
+      const configFile = await loadConfigFromFile({
+        command: config.command,
+        mode: config.mode,
+        isSsrBuild: configEnv.isSsrBuild
+      }, config.configFile);
+      configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
+    }
+    // The user is using a vite-based framework that has a custom config file
+    else {
+      configForViteCompiler = config.inlineConfig;
+    }
+    const viteConfig = {
+      ...configForViteCompiler,
+      plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
+        mode: config.mode,
+        pluginFilter
+      }))
+    };
+    compiler = createCompiler({
+      root: config.root,
+      identifiers: getIdentOption(),
+      cssImportSpecifier: fileIdToVirtualId,
+      viteConfig,
+      enableFileWatcher: !isBuild
+    });
+  };
+
+  /**
+   * Lazily creates the compiler, memoizing the initialization promise.
+   *
+   * `buildStart` kicks this off eagerly, but `transform` also awaits it. This
+   * matters because `transform` can run before `buildStart` has finished
+   * creating the compiler when another plugin emits an additional entry whose
+   * module graph is transformed concurrently (e.g. a module federation plugin
+   * exposing a module as its own chunk). Without awaiting, `transform` would
+   * bail and leave the `.css.ts` untransformed, producing runtime `style()`
+   * calls that throw "Styles were unable to be assigned to a file".
+   */
+  const ensureCompiler = () => {
+    if (unstable_mode === 'transform') {
+      return Promise.resolve();
+    }
+    compilerReady ?? (compilerReady = initializeCompiler());
+    return compilerReady;
+  };
   return [{
     name: `${PLUGIN_NAMESPACE}-inline-dev-css`,
     apply: (_, {
@@ -123,41 +203,7 @@ function vanillaExtractPlugin({
     },
     async buildStart() {
       // Ensure we re-use the compiler instance between builds, e.g. in watch mode
-      if (unstable_mode !== 'transform' && !compiler) {
-        var _configForViteCompile;
-        const {
-          loadConfigFromFile
-        } = await vitePromise;
-        let configForViteCompiler;
-
-        // The user has a vite config file
-        if (config.configFile) {
-          const configFile = await loadConfigFromFile({
-            command: config.command,
-            mode: config.mode,
-            isSsrBuild: configEnv.isSsrBuild
-          }, config.configFile);
-          configForViteCompiler = configFile === null || configFile === void 0 ? void 0 : configFile.config;
-        }
-        // The user is using a vite-based framework that has a custom config file
-        else {
-          configForViteCompiler = config.inlineConfig;
-        }
-        const viteConfig = {
-          ...configForViteCompiler,
-          plugins: (_configForViteCompile = configForViteCompiler) === null || _configForViteCompile === void 0 || (_configForViteCompile = _configForViteCompile.plugins) === null || _configForViteCompile === void 0 ? void 0 : _configForViteCompile.flat().filter(isPluginObject).filter(withUserPluginFilter({
-            mode: config.mode,
-            pluginFilter
-          }))
-        };
-        compiler = createCompiler({
-          root: config.root,
-          identifiers: getIdentOption(),
-          cssImportSpecifier: fileIdToVirtualId,
-          viteConfig,
-          enableFileWatcher: !isBuild
-        });
-      }
+      await ensureCompiler();
     },
     buildEnd() {
       // When using the rollup watcher, we don't want to close the compiler after every build.
@@ -188,10 +234,21 @@ function vanillaExtractPlugin({
           identOption
         });
       }
+
+      // `transform` can run before `buildStart` has finished creating the
+      // compiler (e.g. when another plugin emits an additional entry whose
+      // module graph is transformed concurrently). Await the memoized
+      // initialization rather than bailing, which would leave this `.css.ts`
+      // untransformed. `ensureCompiler` is memoized, so this is a no-op once
+      // the compiler exists.
+      await ensureCompiler();
       if (!compiler) {
         return null;
       }
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         source,
         watchFiles
@@ -238,14 +295,21 @@ function vanillaExtractPlugin({
       });
     },
     resolveId(source) {
-      var _compiler4;
       const [validId, query] = source.split('?');
       if (!isVirtualId(validId)) return;
-      const absoluteId = getAbsoluteId(validId);
-      if ( // We should always have CSS for a file here.
-      // The only valid scenario for a missing one is if someone had written
-      // a file in their app using the .vanilla.js/.vanilla.css extension
-      (_compiler4 = compiler) !== null && _compiler4 !== void 0 && _compiler4.getCssForFile(virtualIdToFileId(absoluteId))) {
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
+      if (!compiler) return;
+
+      // The only valid scenario for a missing CSS entry is if someone had
+      // written a file in their app using the .vanilla.js/.vanilla.css
+      // extension, or the file produced no CSS output.
+      const {
+        css
+      } = compiler.getCssForFile(virtualIdToFileId(absoluteId));
+      if (css) {
         // Keep the original query string for HMR.
         return absoluteId + (query ? `?${query}` : '');
       }
@@ -253,11 +317,16 @@ function vanillaExtractPlugin({
     load(id) {
       const [validId] = id.split('?');
       if (!isVirtualId(validId) || !compiler) return;
-      const absoluteId = getAbsoluteId(validId);
+      const absoluteId = getAbsoluteId({
+        filePath: validId,
+        root: config.root
+      });
       const {
         css
       } = compiler.getCssForFile(virtualIdToFileId(absoluteId));
-      return css;
+      if (css) {
+        return css;
+      }
     }
   }];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vanilla-extract/vite-plugin",
-  "version": "5.2.3-vite-environment-20260407054241",
+  "version": "5.2.4",
   "description": "Zero-runtime Stylesheets-in-TypeScript",
   "main": "dist/vanilla-extract-vite-plugin.cjs.js",
   "module": "dist/vanilla-extract-vite-plugin.esm.js",
@@ -16,13 +16,13 @@
   "author": "SEEK",
   "license": "MIT",
   "dependencies": {
-    "@vanilla-extract/compiler": "^0.7.1-vite-environment-20260407054241",
+    "@vanilla-extract/compiler": "^0.7.1",
     "@vanilla-extract/integration": "^8.0.10"
   },
   "devDependencies": {
-    "vite": "^7.0.0 || ^8.0.0"
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
   },
   "peerDependencies": {
-    "vite": "^7.0.0 || ^8.0.0"
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
   }
 }