feat: 🎸 expose esbuild loglevel & logOverride options

.changeset/curly-parents-vanish.md

@@ -0,0 +1,5 @@
+---
+'@vanilla-extract/integration': minor
+---
+
+Exposed esbuild's logLevel & logOverride options

packages/integration/src/compile.ts

@@ -49,7 +49,7 @@ export interface CompileOptions {
   cwd?: string;
   esbuildOptions?: Pick<
     EsbuildOptions,
-    'plugins' | 'external' | 'define' | 'loader' | 'tsconfig' | 'conditions'
+    'plugins' | 'external' | 'define' | 'loader' | 'tsconfig' | 'conditions' | 'logLevel' | 'logOverride'
   >;
 }
 export async function compile({
@@ -74,6 +74,8 @@ export async function compile({
     define: esbuildOptions?.define,
     tsconfig: esbuildOptions?.tsconfig,
     conditions: esbuildOptions?.conditions,
+    logLevel: esbuildOptions?.logLevel,
+    logOverride: esbuildOptions?.logOverride,
   });
 
   const { outputFiles, metafile } = result;

packages/vite-plugin/src/index.ts

@@ -5,8 +5,8 @@ import type {
   ResolvedConfig,
   ConfigEnv,
   ViteDevServer,
-  Rollup,
   PluginOption,
+  TransformResult,
   UserConfig,
 } from 'vite';
 import {
@@ -40,7 +40,9 @@ const removeIncompatiblePlugins = (plugin: PluginOption) =>
   // Additionally, some internal Remix plugins rely on a `ctx` object to be initialized by
   // the main Remix plugin, and may not function correctly without it. To address this, we
   // filter out all Remix-related plugins.
-  !plugin.name.startsWith('remix');
+  !plugin.name.startsWith('remix') &&
+  // As React-Router plugin works the same as Remix plugin, also ignore it.
+  !plugin.name.startsWith('react-router');
 
 interface Options {
   identifiers?: IdentifierOption;
@@ -96,23 +98,6 @@ export function vanillaExtractPlugin({
     }
   }
 
-  function addWatchFiles(
-    this: Rollup.PluginContext,
-    fromId: string,
-    files: Set<string>,
-  ) {
-    // We don't need to watch files in build mode
-    if (config.command === 'build' && !config.build.watch) {
-      return;
-    }
-
-    for (const file of files) {
-      if (!file.includes('node_modules') && normalizePath(file) !== fromId) {
-        this.addWatchFile(file);
-      }
-    }
-  }
-
   return {
     name: 'vanilla-extract',
     configureServer(_server) {
@@ -210,16 +195,33 @@ export function vanillaExtractPlugin({
           absoluteId,
           { outputCss: true },
         );
-
-        addWatchFiles.call(this, absoluteId, watchFiles);
-
-        // We have to invalidate the virtual module, not the real one we just transformed
-        invalidateModule(fileIdToVirtualId(absoluteId));
-
-        return {
+        const result: TransformResult = {
           code: source,
           map: { mappings: '' },
         };
+
+        // We don't need to watch files in build mode
+        if (config.command === 'build' && !config.build.watch) {
+          return result;
+        }
+
+        for (const file of watchFiles) {
+          if (
+            !file.includes('node_modules') &&
+            normalizePath(file) !== absoluteId
+          ) {
+            this.addWatchFile(file);
+          }
+
+          // We have to invalidate the virtual module & deps, not the real one we just transformed
+          // The deps have to be invalidated in case one of them changing was the trigger causing
+          // the current transformation
+          if (cssFileFilter.test(file)) {
+            invalidateModule(fileIdToVirtualId(file));
+          }
+        }
+
+        return result;
       }
     },
     resolveId(source) {
@@ -251,4 +253,4 @@ export function vanillaExtractPlugin({
       return css;
     },
   };
-}
+}