@vanilla-extract/vite-plugin - npm Package Compare versions

Comparing version 0.0.0-inline-prototype-202342012537 to 0.0.0-vite-plugin-next-20231117055826

dist/vanilla-extract-vite-plugin.cjs.d.ts

 import { Plugin } from 'vite';
-import { IdentifierOption, CompileOptions } from '@vanilla-extract/integration';
+import { IdentifierOption } from '@vanilla-extract/integration';
 
@@ -7,6 +7,5 @@ interface Options {
     emitCssInSsr?: boolean;
-    esbuildOptions?: CompileOptions['esbuildOptions'];
 }
-declare function vanillaExtractPlugin({ identifiers, emitCssInSsr, esbuildOptions, }?: Options): Plugin;
+declare function vanillaExtractPlugin({ identifiers, emitCssInSsr, }?: Options): Plugin;
 
 export { vanillaExtractPlugin };

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

@@ -5,3 +5,3 @@ 'use strict';
 
-var path = require('path');
+require('path');
 var vite = require('vite');
@@ -31,3 +31,2 @@ var outdent = require('outdent');
 
-var path__default = /*#__PURE__*/_interopDefault(path);
 var outdent__default = /*#__PURE__*/_interopDefault(outdent);
@@ -74,13 +73,11 @@
   identifiers,
-  emitCssInSsr,
-  esbuildOptions
+  emitCssInSsr
 } = {}) {
   let config;
-  let server;
-  let postCssConfig;
-  const cssMap = new Map();
+  let compiler;
+  // const cssMap = new Map<string, string>();
+
   const hasEmitCssOverride = typeof emitCssInSsr === 'boolean';
   let resolvedEmitCssInSsr = hasEmitCssOverride ? emitCssInSsr : !!process.env.VITE_RSC_BUILD;
   let packageName;
-  const getAbsoluteVirtualFileId = source => vite.normalizePath(path__default["default"].join(config.root, source));
   return {
@@ -90,4 +87,6 @@ name: 'vanilla-extract',
     configureServer(_server) {
-      server = _server;
     },
+    async buildEnd() {
+      await compiler.close();
+    },
     config(_userConfig, env) {
@@ -107,4 +106,15 @@ const include = env.command === 'serve' ? ['@vanilla-extract/css/injectStyles'] : [];
       packageName = integration.getPackageInfo(config.root).name;
+      compiler = integration.createCompiler({
+        root: resolvedConfig.root,
+        identifiers,
+        cssImportSpecifier: filePath =>
+        // not sure about the config.build.ssr
+        `${filePath}${config.command === 'build' || config.build.ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`
+
+        // TODO: Eventually pass through vite plugins, but filter out VE plugin so we don't
+        // infinitely recurse
+      });
+
       if (config.command === 'serve') {
-        postCssConfig = await resolvePostcssConfig(config);
+        await resolvePostcssConfig(config);
       }
@@ -123,10 +133,26 @@ if (!hasEmitCssOverride && config.plugins.some(plugin => ['astro:build', 'solid-start-server', 'vite-plugin-qwik', 'vite-plugin-svelte'].includes(plugin.name))) {
       // imported from outside the config root.
-      const absoluteId = source.startsWith(config.root) ? source : getAbsoluteVirtualFileId(validId);
+      // const absoluteId = source.startsWith(config.root)
+      //   ? source
+      //   : getAbsoluteVirtualFileId(validId);
+      //
 
+      console.log({
+        validId
+      });
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
       // There should always be an entry in the `cssMap` 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
-      if (cssMap.has(absoluteId)) {
+      console.log({
+        moduleId
+      });
+      try {
+        compiler.getCssForFile(moduleId);
+        console.log({
+          loaded: moduleId
+        });
         // Keep the original query string for HMR.
-        return absoluteId + (query ? `?${query}` : '');
+        return validId + (query ? `?${query}` : '');
+      } catch {
+        //ignore
       }
@@ -136,6 +162,9 @@ },
       const [validId] = id.split('?');
-      if (!cssMap.has(validId)) {
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
+      let css;
+      try {
+        css = compiler.getCssForFile(moduleId).css;
+      } catch {
         return;
       }
-      const css = cssMap.get(validId);
       if (typeof css !== 'string') {
@@ -171,3 +200,3 @@ return;
       }
-      const identOption = identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
+      const identOption = identifiers !== null && identifiers !== void 0 ? identifiers : config.mode === 'production' ? 'short' : 'debug';
       let ssr;
@@ -191,62 +220,113 @@ if (typeof ssrParam === 'boolean') {
         watchFiles
-      } = await integration.compile({
-        filePath: validId,
-        cwd: config.root,
-        esbuildOptions,
-        identOption
-      });
+      } = await compiler.processVanillaFile(validId);
+      // const absoluteId = getAbsoluteVirtualFileId(config.root);
+
       for (const file of watchFiles) {
         // In start mode, we need to prevent the file from rewatching itself.
         // If it's a `build --watch`, it needs to watch everything.
-        if (config.command === 'build' || file !== validId) {
+        if (config.command === 'build' || vite.normalizePath(file) !== validId) {
           this.addWatchFile(file);
         }
       }
-      const output = await integration.processVanillaFile({
-        source,
-        filePath: validId,
-        identOption,
-        serializeVirtualCssPath: async ({
-          fileScope,
-          source
-        }) => {
-          const rootRelativeId = `${fileScope.filePath}${config.command === 'build' || ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`;
-          const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
-          let cssSource = source;
-          if (postCssConfig) {
-            const postCssResult = await (await Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('postcss')); })).default(postCssConfig.plugins).process(source, {
-              ...postCssConfig.options,
-              from: undefined,
-              map: false
-            });
-            cssSource = postCssResult.css;
-          }
-          if (server && cssMap.has(absoluteId) && cssMap.get(absoluteId) !== source) {
-            const {
-              moduleGraph
-            } = server;
-            const modules = Array.from(moduleGraph.getModulesByFile(absoluteId) || []);
-            for (const module of modules) {
-              if (module) {
-                moduleGraph.invalidateModule(module);
 
-                // Vite uses this timestamp to add `?t=` query string automatically for HMR.
-                module.lastHMRTimestamp = module.lastInvalidationTimestamp || Date.now();
-              }
-            }
-            server.ws.send({
-              type: 'custom',
-              event: styleUpdateEvent(absoluteId),
-              data: cssSource
-            });
-          }
-          cssMap.set(absoluteId, cssSource);
+      // let cssSource = compiler.getCssForFile(validId).css;
 
-          // We use the root relative id here to ensure file contents (content-hashes)
-          // are consistent across build machines
-          return `import "${rootRelativeId}";`;
-        }
-      });
+      // if (postCssConfig) {
+      //   const postCssResult = await (await import('postcss'))
+      //     .default(postCssConfig.plugins)
+      //     .process(source, {
+      //       ...postCssConfig.options,
+      //       from: undefined,
+      //       map: false,
+      //     });
+      //
+      //   cssSource = postCssResult.css;
+      // }
+
+      // if (server && cssMap.has(validId) && cssMap.get(validId) !== source) {
+      //   const { moduleGraph } = server;
+      //   const modules = Array.from(moduleGraph.getModulesByFile(validId) || []);
+      //
+      //   for (const module of modules) {
+      //     if (module) {
+      //       moduleGraph.invalidateModule(module);
+      //
+      //       // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //       module.lastHMRTimestamp =
+      //         (module as any).lastInvalidationTimestamp || Date.now();
+      //     }
+      //   }
+      //
+      //   server.ws.send({
+      //     type: 'custom',
+      //     event: styleUpdateEvent(validId),
+      //     data: cssSource,
+      //   });
+      // }
+
+      // cssMap.set(absoluteId, cssSource);
+
+      // const output = await compiler.processVanillaFile({
+      //   source,
+      //   filePath: validId,
+      //   identOption,
+      //   serializeVirtualCssPath: async ({ fileScope, source }) => {
+      //     const rootRelativeId = `${fileScope.filePath}${
+      //       config.command === 'build' || (ssr && resolvedEmitCssInSsr)
+      //         ? virtualExtCss
+      //         : virtualExtJs
+      //     }`;
+      //     const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
+      //
+      //     let cssSource = source;
+      //
+      //     if (postCssConfig) {
+      //       const postCssResult = await (await import('postcss'))
+      //         .default(postCssConfig.plugins)
+      //         .process(source, {
+      //           ...postCssConfig.options,
+      //           from: undefined,
+      //           map: false,
+      //         });
+      //
+      //       cssSource = postCssResult.css;
+      //     }
+      //
+      //     if (
+      //       server &&
+      //       cssMap.has(absoluteId) &&
+      //       cssMap.get(absoluteId) !== source
+      //     ) {
+      //       const { moduleGraph } = server;
+      //       const modules = Array.from(
+      //         moduleGraph.getModulesByFile(absoluteId) || [],
+      //       );
+      //
+      //       for (const module of modules) {
+      //         if (module) {
+      //           moduleGraph.invalidateModule(module);
+      //
+      //           // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //           module.lastHMRTimestamp =
+      //             (module as any).lastInvalidationTimestamp || Date.now();
+      //         }
+      //       }
+      //
+      //       server.ws.send({
+      //         type: 'custom',
+      //         event: styleUpdateEvent(absoluteId),
+      //         data: cssSource,
+      //       });
+      //     }
+      //
+      //     cssMap.set(absoluteId, cssSource);
+      //
+      //     // We use the root relative id here to ensure file contents (content-hashes)
+      //     // are consistent across build machines
+      //     return `import "${rootRelativeId}";`;
+      //   },
+      // });
+
       return {
-        code: output,
+        code: source,
         map: {
@@ -253,0 +333,0 @@ mappings: ''

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

@@ -5,3 +5,3 @@ 'use strict';
 
-var path = require('path');
+require('path');
 var vite = require('vite');
@@ -31,3 +31,2 @@ var outdent = require('outdent');
 
-var path__default = /*#__PURE__*/_interopDefault(path);
 var outdent__default = /*#__PURE__*/_interopDefault(outdent);
@@ -74,13 +73,11 @@
   identifiers,
-  emitCssInSsr,
-  esbuildOptions
+  emitCssInSsr
 } = {}) {
   let config;
-  let server;
-  let postCssConfig;
-  const cssMap = new Map();
+  let compiler;
+  // const cssMap = new Map<string, string>();
+
   const hasEmitCssOverride = typeof emitCssInSsr === 'boolean';
   let resolvedEmitCssInSsr = hasEmitCssOverride ? emitCssInSsr : !!process.env.VITE_RSC_BUILD;
   let packageName;
-  const getAbsoluteVirtualFileId = source => vite.normalizePath(path__default["default"].join(config.root, source));
   return {
@@ -90,4 +87,6 @@ name: 'vanilla-extract',
     configureServer(_server) {
-      server = _server;
     },
+    async buildEnd() {
+      await compiler.close();
+    },
     config(_userConfig, env) {
@@ -107,4 +106,15 @@ const include = env.command === 'serve' ? ['@vanilla-extract/css/injectStyles'] : [];
       packageName = integration.getPackageInfo(config.root).name;
+      compiler = integration.createCompiler({
+        root: resolvedConfig.root,
+        identifiers,
+        cssImportSpecifier: filePath =>
+        // not sure about the config.build.ssr
+        `${filePath}${config.command === 'build' || config.build.ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`
+
+        // TODO: Eventually pass through vite plugins, but filter out VE plugin so we don't
+        // infinitely recurse
+      });
+
       if (config.command === 'serve') {
-        postCssConfig = await resolvePostcssConfig(config);
+        await resolvePostcssConfig(config);
       }
@@ -123,10 +133,26 @@ if (!hasEmitCssOverride && config.plugins.some(plugin => ['astro:build', 'solid-start-server', 'vite-plugin-qwik', 'vite-plugin-svelte'].includes(plugin.name))) {
       // imported from outside the config root.
-      const absoluteId = source.startsWith(config.root) ? source : getAbsoluteVirtualFileId(validId);
+      // const absoluteId = source.startsWith(config.root)
+      //   ? source
+      //   : getAbsoluteVirtualFileId(validId);
+      //
 
+      console.log({
+        validId
+      });
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
       // There should always be an entry in the `cssMap` 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
-      if (cssMap.has(absoluteId)) {
+      console.log({
+        moduleId
+      });
+      try {
+        compiler.getCssForFile(moduleId);
+        console.log({
+          loaded: moduleId
+        });
         // Keep the original query string for HMR.
-        return absoluteId + (query ? `?${query}` : '');
+        return validId + (query ? `?${query}` : '');
+      } catch {
+        //ignore
       }
@@ -136,6 +162,9 @@ },
       const [validId] = id.split('?');
-      if (!cssMap.has(validId)) {
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
+      let css;
+      try {
+        css = compiler.getCssForFile(moduleId).css;
+      } catch {
         return;
       }
-      const css = cssMap.get(validId);
       if (typeof css !== 'string') {
@@ -171,3 +200,3 @@ return;
       }
-      const identOption = identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
+      const identOption = identifiers !== null && identifiers !== void 0 ? identifiers : config.mode === 'production' ? 'short' : 'debug';
       let ssr;
@@ -191,62 +220,113 @@ if (typeof ssrParam === 'boolean') {
         watchFiles
-      } = await integration.compile({
-        filePath: validId,
-        cwd: config.root,
-        esbuildOptions,
-        identOption
-      });
+      } = await compiler.processVanillaFile(validId);
+      // const absoluteId = getAbsoluteVirtualFileId(config.root);
+
       for (const file of watchFiles) {
         // In start mode, we need to prevent the file from rewatching itself.
         // If it's a `build --watch`, it needs to watch everything.
-        if (config.command === 'build' || file !== validId) {
+        if (config.command === 'build' || vite.normalizePath(file) !== validId) {
           this.addWatchFile(file);
         }
       }
-      const output = await integration.processVanillaFile({
-        source,
-        filePath: validId,
-        identOption,
-        serializeVirtualCssPath: async ({
-          fileScope,
-          source
-        }) => {
-          const rootRelativeId = `${fileScope.filePath}${config.command === 'build' || ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`;
-          const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
-          let cssSource = source;
-          if (postCssConfig) {
-            const postCssResult = await (await Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('postcss')); })).default(postCssConfig.plugins).process(source, {
-              ...postCssConfig.options,
-              from: undefined,
-              map: false
-            });
-            cssSource = postCssResult.css;
-          }
-          if (server && cssMap.has(absoluteId) && cssMap.get(absoluteId) !== source) {
-            const {
-              moduleGraph
-            } = server;
-            const modules = Array.from(moduleGraph.getModulesByFile(absoluteId) || []);
-            for (const module of modules) {
-              if (module) {
-                moduleGraph.invalidateModule(module);
 
-                // Vite uses this timestamp to add `?t=` query string automatically for HMR.
-                module.lastHMRTimestamp = module.lastInvalidationTimestamp || Date.now();
-              }
-            }
-            server.ws.send({
-              type: 'custom',
-              event: styleUpdateEvent(absoluteId),
-              data: cssSource
-            });
-          }
-          cssMap.set(absoluteId, cssSource);
+      // let cssSource = compiler.getCssForFile(validId).css;
 
-          // We use the root relative id here to ensure file contents (content-hashes)
-          // are consistent across build machines
-          return `import "${rootRelativeId}";`;
-        }
-      });
+      // if (postCssConfig) {
+      //   const postCssResult = await (await import('postcss'))
+      //     .default(postCssConfig.plugins)
+      //     .process(source, {
+      //       ...postCssConfig.options,
+      //       from: undefined,
+      //       map: false,
+      //     });
+      //
+      //   cssSource = postCssResult.css;
+      // }
+
+      // if (server && cssMap.has(validId) && cssMap.get(validId) !== source) {
+      //   const { moduleGraph } = server;
+      //   const modules = Array.from(moduleGraph.getModulesByFile(validId) || []);
+      //
+      //   for (const module of modules) {
+      //     if (module) {
+      //       moduleGraph.invalidateModule(module);
+      //
+      //       // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //       module.lastHMRTimestamp =
+      //         (module as any).lastInvalidationTimestamp || Date.now();
+      //     }
+      //   }
+      //
+      //   server.ws.send({
+      //     type: 'custom',
+      //     event: styleUpdateEvent(validId),
+      //     data: cssSource,
+      //   });
+      // }
+
+      // cssMap.set(absoluteId, cssSource);
+
+      // const output = await compiler.processVanillaFile({
+      //   source,
+      //   filePath: validId,
+      //   identOption,
+      //   serializeVirtualCssPath: async ({ fileScope, source }) => {
+      //     const rootRelativeId = `${fileScope.filePath}${
+      //       config.command === 'build' || (ssr && resolvedEmitCssInSsr)
+      //         ? virtualExtCss
+      //         : virtualExtJs
+      //     }`;
+      //     const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
+      //
+      //     let cssSource = source;
+      //
+      //     if (postCssConfig) {
+      //       const postCssResult = await (await import('postcss'))
+      //         .default(postCssConfig.plugins)
+      //         .process(source, {
+      //           ...postCssConfig.options,
+      //           from: undefined,
+      //           map: false,
+      //         });
+      //
+      //       cssSource = postCssResult.css;
+      //     }
+      //
+      //     if (
+      //       server &&
+      //       cssMap.has(absoluteId) &&
+      //       cssMap.get(absoluteId) !== source
+      //     ) {
+      //       const { moduleGraph } = server;
+      //       const modules = Array.from(
+      //         moduleGraph.getModulesByFile(absoluteId) || [],
+      //       );
+      //
+      //       for (const module of modules) {
+      //         if (module) {
+      //           moduleGraph.invalidateModule(module);
+      //
+      //           // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //           module.lastHMRTimestamp =
+      //             (module as any).lastInvalidationTimestamp || Date.now();
+      //         }
+      //       }
+      //
+      //       server.ws.send({
+      //         type: 'custom',
+      //         event: styleUpdateEvent(absoluteId),
+      //         data: cssSource,
+      //       });
+      //     }
+      //
+      //     cssMap.set(absoluteId, cssSource);
+      //
+      //     // We use the root relative id here to ensure file contents (content-hashes)
+      //     // are consistent across build machines
+      //     return `import "${rootRelativeId}";`;
+      //   },
+      // });
+
       return {
-        code: output,
+        code: source,
         map: {
@@ -253,0 +333,0 @@ mappings: ''

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

@@ -1,5 +0,5 @@
-import path from 'path';
+import 'path';
 import { normalizePath } from 'vite';
 import outdent from 'outdent';
-import { getPackageInfo, cssFileFilter, transform, compile, processVanillaFile } from '@vanilla-extract/integration';
+import { getPackageInfo, createCompiler, cssFileFilter, transform } from '@vanilla-extract/integration';
 
@@ -45,13 +45,11 @@ // Mostly copied from vite's implementation
   identifiers,
-  emitCssInSsr,
-  esbuildOptions
+  emitCssInSsr
 } = {}) {
   let config;
-  let server;
-  let postCssConfig;
-  const cssMap = new Map();
+  let compiler;
+  // const cssMap = new Map<string, string>();
+
   const hasEmitCssOverride = typeof emitCssInSsr === 'boolean';
   let resolvedEmitCssInSsr = hasEmitCssOverride ? emitCssInSsr : !!process.env.VITE_RSC_BUILD;
   let packageName;
-  const getAbsoluteVirtualFileId = source => normalizePath(path.join(config.root, source));
   return {
@@ -61,4 +59,6 @@ name: 'vanilla-extract',
     configureServer(_server) {
-      server = _server;
     },
+    async buildEnd() {
+      await compiler.close();
+    },
     config(_userConfig, env) {
@@ -78,4 +78,15 @@ const include = env.command === 'serve' ? ['@vanilla-extract/css/injectStyles'] : [];
       packageName = getPackageInfo(config.root).name;
+      compiler = createCompiler({
+        root: resolvedConfig.root,
+        identifiers,
+        cssImportSpecifier: filePath =>
+        // not sure about the config.build.ssr
+        `${filePath}${config.command === 'build' || config.build.ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`
+
+        // TODO: Eventually pass through vite plugins, but filter out VE plugin so we don't
+        // infinitely recurse
+      });
+
       if (config.command === 'serve') {
-        postCssConfig = await resolvePostcssConfig(config);
+        await resolvePostcssConfig(config);
       }
@@ -94,10 +105,26 @@ if (!hasEmitCssOverride && config.plugins.some(plugin => ['astro:build', 'solid-start-server', 'vite-plugin-qwik', 'vite-plugin-svelte'].includes(plugin.name))) {
       // imported from outside the config root.
-      const absoluteId = source.startsWith(config.root) ? source : getAbsoluteVirtualFileId(validId);
+      // const absoluteId = source.startsWith(config.root)
+      //   ? source
+      //   : getAbsoluteVirtualFileId(validId);
+      //
 
+      console.log({
+        validId
+      });
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
       // There should always be an entry in the `cssMap` 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
-      if (cssMap.has(absoluteId)) {
+      console.log({
+        moduleId
+      });
+      try {
+        compiler.getCssForFile(moduleId);
+        console.log({
+          loaded: moduleId
+        });
         // Keep the original query string for HMR.
-        return absoluteId + (query ? `?${query}` : '');
+        return validId + (query ? `?${query}` : '');
+      } catch {
+        //ignore
       }
@@ -107,6 +134,9 @@ },
       const [validId] = id.split('?');
-      if (!cssMap.has(validId)) {
+      const moduleId = validId.split(/(\.vanilla\.js|\.vanilla\.css)/)[0];
+      let css;
+      try {
+        css = compiler.getCssForFile(moduleId).css;
+      } catch {
         return;
       }
-      const css = cssMap.get(validId);
       if (typeof css !== 'string') {
@@ -142,3 +172,3 @@ return;
       }
-      const identOption = identifiers ?? (config.mode === 'production' ? 'short' : 'debug');
+      const identOption = identifiers !== null && identifiers !== void 0 ? identifiers : config.mode === 'production' ? 'short' : 'debug';
       let ssr;
@@ -162,62 +192,113 @@ if (typeof ssrParam === 'boolean') {
         watchFiles
-      } = await compile({
-        filePath: validId,
-        cwd: config.root,
-        esbuildOptions,
-        identOption
-      });
+      } = await compiler.processVanillaFile(validId);
+      // const absoluteId = getAbsoluteVirtualFileId(config.root);
+
       for (const file of watchFiles) {
         // In start mode, we need to prevent the file from rewatching itself.
         // If it's a `build --watch`, it needs to watch everything.
-        if (config.command === 'build' || file !== validId) {
+        if (config.command === 'build' || normalizePath(file) !== validId) {
           this.addWatchFile(file);
         }
       }
-      const output = await processVanillaFile({
-        source,
-        filePath: validId,
-        identOption,
-        serializeVirtualCssPath: async ({
-          fileScope,
-          source
-        }) => {
-          const rootRelativeId = `${fileScope.filePath}${config.command === 'build' || ssr && resolvedEmitCssInSsr ? virtualExtCss : virtualExtJs}`;
-          const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
-          let cssSource = source;
-          if (postCssConfig) {
-            const postCssResult = await (await import('postcss')).default(postCssConfig.plugins).process(source, {
-              ...postCssConfig.options,
-              from: undefined,
-              map: false
-            });
-            cssSource = postCssResult.css;
-          }
-          if (server && cssMap.has(absoluteId) && cssMap.get(absoluteId) !== source) {
-            const {
-              moduleGraph
-            } = server;
-            const modules = Array.from(moduleGraph.getModulesByFile(absoluteId) || []);
-            for (const module of modules) {
-              if (module) {
-                moduleGraph.invalidateModule(module);
 
-                // Vite uses this timestamp to add `?t=` query string automatically for HMR.
-                module.lastHMRTimestamp = module.lastInvalidationTimestamp || Date.now();
-              }
-            }
-            server.ws.send({
-              type: 'custom',
-              event: styleUpdateEvent(absoluteId),
-              data: cssSource
-            });
-          }
-          cssMap.set(absoluteId, cssSource);
+      // let cssSource = compiler.getCssForFile(validId).css;
 
-          // We use the root relative id here to ensure file contents (content-hashes)
-          // are consistent across build machines
-          return `import "${rootRelativeId}";`;
-        }
-      });
+      // if (postCssConfig) {
+      //   const postCssResult = await (await import('postcss'))
+      //     .default(postCssConfig.plugins)
+      //     .process(source, {
+      //       ...postCssConfig.options,
+      //       from: undefined,
+      //       map: false,
+      //     });
+      //
+      //   cssSource = postCssResult.css;
+      // }
+
+      // if (server && cssMap.has(validId) && cssMap.get(validId) !== source) {
+      //   const { moduleGraph } = server;
+      //   const modules = Array.from(moduleGraph.getModulesByFile(validId) || []);
+      //
+      //   for (const module of modules) {
+      //     if (module) {
+      //       moduleGraph.invalidateModule(module);
+      //
+      //       // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //       module.lastHMRTimestamp =
+      //         (module as any).lastInvalidationTimestamp || Date.now();
+      //     }
+      //   }
+      //
+      //   server.ws.send({
+      //     type: 'custom',
+      //     event: styleUpdateEvent(validId),
+      //     data: cssSource,
+      //   });
+      // }
+
+      // cssMap.set(absoluteId, cssSource);
+
+      // const output = await compiler.processVanillaFile({
+      //   source,
+      //   filePath: validId,
+      //   identOption,
+      //   serializeVirtualCssPath: async ({ fileScope, source }) => {
+      //     const rootRelativeId = `${fileScope.filePath}${
+      //       config.command === 'build' || (ssr && resolvedEmitCssInSsr)
+      //         ? virtualExtCss
+      //         : virtualExtJs
+      //     }`;
+      //     const absoluteId = getAbsoluteVirtualFileId(rootRelativeId);
+      //
+      //     let cssSource = source;
+      //
+      //     if (postCssConfig) {
+      //       const postCssResult = await (await import('postcss'))
+      //         .default(postCssConfig.plugins)
+      //         .process(source, {
+      //           ...postCssConfig.options,
+      //           from: undefined,
+      //           map: false,
+      //         });
+      //
+      //       cssSource = postCssResult.css;
+      //     }
+      //
+      //     if (
+      //       server &&
+      //       cssMap.has(absoluteId) &&
+      //       cssMap.get(absoluteId) !== source
+      //     ) {
+      //       const { moduleGraph } = server;
+      //       const modules = Array.from(
+      //         moduleGraph.getModulesByFile(absoluteId) || [],
+      //       );
+      //
+      //       for (const module of modules) {
+      //         if (module) {
+      //           moduleGraph.invalidateModule(module);
+      //
+      //           // Vite uses this timestamp to add `?t=` query string automatically for HMR.
+      //           module.lastHMRTimestamp =
+      //             (module as any).lastInvalidationTimestamp || Date.now();
+      //         }
+      //       }
+      //
+      //       server.ws.send({
+      //         type: 'custom',
+      //         event: styleUpdateEvent(absoluteId),
+      //         data: cssSource,
+      //       });
+      //     }
+      //
+      //     cssMap.set(absoluteId, cssSource);
+      //
+      //     // We use the root relative id here to ensure file contents (content-hashes)
+      //     // are consistent across build machines
+      //     return `import "${rootRelativeId}";`;
+      //   },
+      // });
+
       return {
-        code: output,
+        code: source,
         map: {
@@ -224,0 +305,0 @@ mappings: ''

package.json

 {
   "name": "@vanilla-extract/vite-plugin",
-  "version": "0.0.0-inline-prototype-202342012537",
+  "version": "0.0.0-vite-plugin-next-20231117055826",
   "description": "Zero-runtime Stylesheets-in-TypeScript",
@@ -18,6 +18,6 @@ "main": "dist/vanilla-extract-vite-plugin.cjs.js",
   "dependencies": {
-    "@vanilla-extract/integration": "^0.0.0-inline-prototype-202342012537",
+    "@vanilla-extract/integration": "^6.0.2",
     "outdent": "^0.8.0",
     "postcss": "^8.3.6",
-    "postcss-load-config": "^3.1.0"
+    "postcss-load-config": "^4.0.1"
   },
@@ -24,0 +24,0 @@ "devDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

36849

increased by22.32%

Number of downloads

122652

increased by6.4%

Lines of code

917

increased by30.81%

Worsened metrics

Published versions last year

45

decreased by-2.17%

Dependency changes

• + Added@vanilla-extract/integration@6.5.0(transitive)

• + Addedlilconfig@3.1.3(transitive)

• + Addedlodash@4.17.21(transitive)

• + Addedpostcss-load-config@4.0.2(transitive)

• + Addedyaml@2.7.0(transitive)

• - Removed@vanilla-extract/integration@0.0.0-webpack-vite-compiler-wip-20240609024920(transitive)

• - Removedlilconfig@2.1.0(transitive)

• - Removedpostcss-load-config@3.1.4(transitive)

• - Removedyaml@1.10.2(transitive)

• Updated@vanilla-extract/integration@^6.0.2

• Updatedpostcss-load-config@^4.0.1