fix(stylex): revert to vite-plugin-stylex-dev for now (#1106)

for #1102 This reverts #1105 and reopens #750. Co-authored-by: Tyler <[email protected]>
dai-shi · Dec 29, 2024 · ff094e1 · ff094e1
1 parent 4bbb3f4
commit ff094e1
Show file tree

Hide file tree

Showing 5 changed files with 97 additions and 85 deletions.
diff --git a/examples/37_css/package.json b/examples/37_css/package.json
@@ -20,9 +20,9 @@
   "devDependencies": {
     "@types/react": "19.0.2",
     "@types/react-dom": "19.0.2",
-    "@vanilla-extract/vite-plugin": "4.0.18",
+    "@vanilla-extract/vite-plugin": "4.0.19",
     "typescript": "5.7.2",
     "vite": "6.0.6",
-    "vite-plugin-stylex": "0.13.0"
+    "vite-plugin-stylex-dev": "0.7.5"
   }
 }
diff --git a/examples/37_css/src/components/app.css b/examples/37_css/src/components/app.css
@@ -1,5 +1,3 @@
-@stylex stylesheet;
-
 h1 {
   color: red;
 }
diff --git a/examples/37_css/src/components/layout.tsx b/examples/37_css/src/components/layout.tsx
@@ -3,6 +3,9 @@ import type { ReactNode } from 'react';
 
 import './layout.styles.css';
 
+// eslint-disable-next-line import/no-unresolved
+import '@stylex-dev.css';
+
 const Layout = ({ children }: { children: ReactNode }) => {
   return (
     <html>

diff --git a/examples/37_css/waku.config.ts b/examples/37_css/waku.config.ts
@@ -1,21 +1,21 @@
 import { defineConfig } from 'waku/config';
 import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
-import stylexPlugin from 'vite-plugin-stylex';
+import { stylex } from 'vite-plugin-stylex-dev';
 
 export default defineConfig({
   unstable_viteConfigs: {
     common: () => ({
       plugins: [
         {
-          name: 'hack-css-plugin-needed-for-stylex-FIXME',
+          name: 'hack-css-plugin-needed-for-stylex-dev-FIXME',
           resolveId(id: string) {
             if (id.endsWith('.css') && !id.endsWith('.vanilla.css')) {
               return id;
             }
           },
         },
         vanillaExtractPlugin(),
-        stylexPlugin() as any, // FIXME no-any
+        stylex(),
       ],
     }),
   },