unplugin-stylex 0.6.2 → 0.6.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # unplugin-stylex
 
+## 0.6.3
+
+### Patch Changes
+
+- [#321](https://github.com/eryue0220/unplugin-stylex/pull/321) [`cfd5f0b`](https://github.com/eryue0220/unplugin-stylex/commit/cfd5f0bbb9ca21026fd8f9094655e0b0bababcf3) Thanks [@eryue0220](https://github.com/eryue0220)! - update deps
+
 ## 0.6.2
 
 ### Patch Changes

package/README.md

@@ -1,29 +1,46 @@
 # unplugin-stylex · [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/eryue0220/unplugin-stylex/blob/main/LICENSE) [![npm version](https://img.shields.io/npm/v/unplugin-stylex.svg?style=flat)](https://www.npmjs.com/package/unplugin-stylex)
 
-## Installation
+`unplugin-stylex` brings StyleX transform support to multiple bundlers via [unplugin](https://github.com/unjs/unplugin).
 
-Install the package from the following command
+## Installation
 
-```shell
-npm install unplugin-stylex --save-dev
+```bash
+npm i -D unplugin-stylex @stylexjs/stylex
 ```
 
-or with yarn:
+or
 
-```shell
-yarn add unplugin-stylex --save-dev
+```bash
+yarn add -D unplugin-stylex @stylexjs/stylex
 ```
 
-or with pnpm:
+or
 
-```shell
-pnpm i unplugin-stylex --save-dev
+```bash
+pnpm add -D unplugin-stylex @stylexjs/stylex
 ```
 
-## Configuration
+## Requirements
+
+- Node.js: `^20.19.0 || >=22.12.0`
+- Peer dependency: `@stylexjs/stylex@0.x`
+
+## Supported Targets
+
+- Vite (`unplugin-stylex/vite`)
+- Astro integration (`unplugin-stylex/astro`)
+- Esbuild (`unplugin-stylex/esbuild`)
+- Farm (`unplugin-stylex/farm`)
+- Rspack (`unplugin-stylex/rspack`)
+- RSBuild (through Rspack plugin in `tools.rspack.plugins`)
+- Rolldown (`unplugin-stylex/rolldown`)
+- Rollup (`unplugin-stylex/rollup`)
+- Webpack (`unplugin-stylex/webpack`)
+
+## Quick Start
 
 <details>
-<summary>vite</summary><br>
+<summary>Vite</summary>
 
 ```js
 // vite.config.js
@@ -32,32 +49,50 @@ import stylexPlugin from 'unplugin-stylex/vite'
 
 export default defineConfig({
   plugins: [
-    stylexPlugin({ /* options */}),
+    stylexPlugin(),
+  ],
+})
+```
+
+</details>
+
+<details>
+<summary>Astro</summary>
+
+```js
+// astro.config.mjs
+import { defineConfig } from 'astro/config'
+import stylexAstroPlugin from 'unplugin-stylex/astro'
+
+export default defineConfig({
+  integrations: [
+    stylexAstroPlugin(),
   ],
 })
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>esbuild</summary><br>
+<summary>Esbuild</summary>
 
 ```js
 // esbuild.config.js
 import { build } from 'esbuild'
 import stylexPlugin from 'unplugin-stylex/esbuild'
 
-export default {
-  plugins: [
-    stylexPlugin({ /* options */ }),
-  ],
-}
+build({
+  entryPoints: ['src/index.tsx'],
+  bundle: true,
+  outfile: 'dist/out.js',
+  plugins: [stylexPlugin()],
+})
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>farm</summary><br>
+<summary>Farm</summary>
 
 ```js
 // farm.config.js
@@ -65,117 +100,141 @@ import { defineConfig } from '@farmfe/core'
 import stylexPlugin from 'unplugin-stylex/farm'
 
 export default defineConfig({
-  // other rollup config
-  plugins: [
-    stylexPlugin({ /* options */}),
-  ],
+  plugins: [stylexPlugin()],
 })
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>rspack</summary><br>
+<summary>Rspack</summary>
 
 ```js
 // rspack.config.js
 import stylexPlugin from 'unplugin-stylex/rspack'
 
-module.exports = {
-  // other rspack config
-  plugins: [
-    stylexPlugin({ /* options */}),
-  ],
+export default {
+  plugins: [stylexPlugin()],
 }
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>rolldown</summary><br>
+<summary>RSBuild</summary>
+
+```ts
+// rsbuild.config.ts
+import { defineConfig } from '@rsbuild/core'
+import stylexPlugin from 'unplugin-stylex/rspack'
+
+export default defineConfig({
+  tools: {
+    rspack: {
+      plugins: [stylexPlugin()],
+    },
+  },
+})
+```
+
+</details>
+
+<details>
+<summary>Rolldown</summary>
 
 ```js
-// rolldown.config.js
-import stylexRolldownPlugin from 'unplugin-stylex/rolldown'
+// rolldown.config.mjs
+import { defineConfig } from 'rolldown'
+import stylexPlugin from 'unplugin-stylex/rolldown'
 
-export default {
-  // other rolldown config
-  plugins: [
-    stylexRolldownPlugin({ /* options */}),
-  ],
-}
+export default defineConfig({
+  plugins: [stylexPlugin()],
+})
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>rollup</summary><br>
+<summary>Rollup</summary>
 
 ```js
 // rollup.config.js
-import stylexRollupPlugin from 'unplugin-stylex/rollup'
+import stylexPlugin from 'unplugin-stylex/rollup'
 
 export default {
-  // other rollup config
-  plugins: [
-    stylexRollupPlugin({ /* options */}),
-  ],
+  plugins: [stylexPlugin()],
 }
 ```
 
-</br></details>
+</details>
 
 <details>
-<summary>webpack</summary><br>
+<summary>Webpack</summary>
 
 ```js
 // webpack.config.js
-import stylexWebpackPlugin from 'unplugin-stylex/webpack'
+const stylexPlugin = require('unplugin-stylex/webpack').default
 
 module.exports = {
-  // other webpack config
-  plugins: [
-    stylexWebpackPlugin({ /* options */}),
-  ],
+  plugins: [stylexPlugin()],
 }
 ```
 
-</br></details>
-
-## Usage
-
-More detail usage can check [examples](https://github.com/eryue0220/unplugin-stylex/tree/main/examples)
+</details>
 
 ## Options
 
-Current support argument, which may have change in the future
-
-### options.dev
-
-#### options.stylex.runtimeInjection
-
-#### options.stylex.classNamePrefix
-
-#### options.stylex.useCSSLayers
-
-#### options.stylex.babelConfig
+```ts
+type UnpluginStylexOptions = {
+  validExts?: RegExp | string[]
+  dev?: boolean
+  stylex?: {
+    filename?: string
+    aliases?: Record<string, string | string[]>
+    stylexImports?: string[]
+    classNamePrefix?: string
+    unstable_moduleResolution?: {
+      type: 'commonJS' | 'haste'
+      rootDir: string
+    }
+    babelConfig?: {
+      plugins: unknown[]
+      presets: unknown[]
+      babelrc: boolean
+    }
+    useCSSLayers?: boolean
+    genConditionalClasses?: boolean
+    treeshakeCompensation?: boolean
+    runtimeInjection?: boolean
+  }
+}
+```
 
-#### options.stylex.stylexImports
+### Defaults
 
-#### options.stylex.unstable_moduleResolution
+- `validExts`: `/\.[mc]?[jt]sx?$|\.svelte$|\.vue$/`
+- `dev`: inferred from environment (`NODE_ENV` / `BABEL_ENV`) unless explicitly set
+- `stylex.filename`: `'stylex.css'`
+- `stylex.stylexImports`: `['@stylexjs/stylex']`
+- `stylex.runtimeInjection`: follows `dev` by default
+- `stylex.aliases`: auto-reads from project config (TS paths + bundler aliases when available)
+- `stylex.useCSSLayers`: `false`
+- `stylex.unstable_moduleResolution`: `{ type: 'commonJS', rootDir: process.cwd() }`
+- `stylex.babelConfig`: `{ babelrc: false, plugins: [], presets: [] }`
 
-## Monorepo
+## Notes
 
-本仓库使用 [Turborepo](https://turbo.build/repo) 管理 monorepo。在根目录可执行：
+- The plugin only transforms modules containing at least one `stylexImports` source.
+- Output CSS is emitted as an asset file (`stylex.css` by default).
+- Vite and Astro integrations also handle dev server CSS serving and HTML injection.
+- Astro integration defaults `validExts` to include `.astro` and `.stylex`.
+- For Farm projects, `treeshakeCompensation: true` is usually needed (see example config).
 
-- `pnpm turbo:build` — 按依赖顺序构建所有包（主包与 examples）
-- `pnpm turbo:test` — 在所有包中运行测试
-- `pnpm turbo:lint` / `pnpm turbo:check` — 在所有包中运行 lint / check
-- `pnpm turbo:dev` — 并行启动所有包的 dev 脚本
+## Examples
 
-仅构建主包：`pnpm turbo run build --filter=unplugin-stylex`。仅构建某个 example：`pnpm turbo run build --filter=vite-example`。
+- See runnable examples in [`examples`](https://github.com/eryue0220/unplugin-stylex/tree/main/examples)
 
-# Acknowledgments
+## Acknowledgments
 
 - [@stylexjs/rollup-plugin](https://github.com/facebook/stylex/tree/main/packages/rollup-plugin)
-- [vite-plugin-stylex](https://github.com/HorusGoul/vite-plugin-stylex)
+- [vite-plugin-stylex](https://github.com/HorusGoul/vite-plugin-stylex)

package/dist/astro.cjs

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
 
-var _chunkO4FQWPVVcjs = require('./chunk-O4FQWPVV.cjs');
+var _chunkWDYGV6FUcjs = require('./chunk-WDYGV6FU.cjs');
 
 
 
@@ -9,15 +9,15 @@ var _chunkO4FQWPVVcjs = require('./chunk-O4FQWPVV.cjs');
 
 
 
-var _chunkKKH6K7REcjs = require('./chunk-KKH6K7RE.cjs');
+var _chunk45JWH4GZcjs = require('./chunk-45JWH4GZ.cjs');
 require('./chunk-ZBPRDZS4.cjs');
 
 // src/astro.ts
 function astro(options = {}) {
-  const configured = _chunkKKH6K7REcjs.getOptions.call(void 0, { ...options, framework: "vite" });
-  const filename = configured.stylex.filename;
+  const configured = _chunk45JWH4GZcjs.getOptions.call(void 0, { ...options, framework: "vite" });
+  const filename = _nullishCoalesce(configured.stylex.filename, () => ( "stylex.css"));
   return {
-    name: _chunkKKH6K7REcjs.PLUGIN_NAME,
+    name: _chunk45JWH4GZcjs.PLUGIN_NAME,
     hooks: {
       "astro:config:setup": async ({ config, updateConfig, injectScript }) => {
         var _a, _b;
@@ -25,19 +25,19 @@ function astro(options = {}) {
           ...options,
           validExts: _nullishCoalesce(options.validExts, () => ( /\.[mc]?[jt]sx?$|\.astro$|\.stylex$/))
         };
-        if (!_chunkKKH6K7REcjs.stylexRulesStore.has(_chunkKKH6K7REcjs.STORE_KEY)) {
-          _chunkKKH6K7REcjs.stylexRulesStore.set(_chunkKKH6K7REcjs.STORE_KEY, {});
+        if (!_chunk45JWH4GZcjs.stylexRulesStore.has(_chunk45JWH4GZcjs.STORE_KEY)) {
+          _chunk45JWH4GZcjs.stylexRulesStore.set(_chunk45JWH4GZcjs.STORE_KEY, {});
         }
         config.vite.plugins ??= [];
-        const basePlugin = _chunkO4FQWPVVcjs.vite_default.call(void 0, astroOptions);
+        const basePlugin = _chunkWDYGV6FUcjs.vite_default.call(void 0, astroOptions);
         const wrappedPlugin = {
           ...basePlugin,
-          getStylexRules: () => _chunkKKH6K7REcjs.stylexRulesStore.get(_chunkKKH6K7REcjs.STORE_KEY) || {}
+          getStylexRules: () => _chunk45JWH4GZcjs.stylexRulesStore.get(_chunk45JWH4GZcjs.STORE_KEY) || {}
         };
         const base = _nullishCoalesce(config.base, () => ( "/"));
         const assetsDir = typeof ((_a = config.build) == null ? void 0 : _a.assets) === "string" ? config.build.assets : "_astro";
-        const fileName = _chunkKKH6K7REcjs.getStylexAssetFileName.call(void 0, filename, assetsDir);
-        const cssPath = _chunkKKH6K7REcjs.getStylexPublicPath.call(void 0, base, fileName);
+        const fileName = _chunk45JWH4GZcjs.getStylexAssetFileName.call(void 0, filename, assetsDir);
+        const cssPath = _chunk45JWH4GZcjs.getStylexPublicPath.call(void 0, base, fileName);
         injectScript(
           "head-inline",
           `
@@ -67,12 +67,12 @@ function astro(options = {}) {
         server.middlewares.use((req, res, next) => {
           var _a, _b;
           const assetsDir = "_astro";
-          const fileName = _chunkKKH6K7REcjs.getStylexAssetFileName.call(void 0, filename, assetsDir);
-          const cssPath = _chunkKKH6K7REcjs.getStylexPublicPath.call(void 0, "/", fileName);
+          const fileName = _chunk45JWH4GZcjs.getStylexAssetFileName.call(void 0, filename, assetsDir);
+          const cssPath = _chunk45JWH4GZcjs.getStylexPublicPath.call(void 0, "/", fileName);
           const normalizedUrl = (_a = req.url) == null ? void 0 : _a.split("?")[0];
           if (normalizedUrl === cssPath || normalizedUrl === `/${filename}` || (normalizedUrl == null ? void 0 : normalizedUrl.endsWith(`/${filename}`)) || normalizedUrl === filename) {
-            const stylexRules = _nullishCoalesce(_chunkKKH6K7REcjs.stylexRulesStore.get(_chunkKKH6K7REcjs.STORE_KEY), () => ( {}));
-            const collectedCSS = _chunkKKH6K7REcjs.buildStylexRules.call(void 0, stylexRules, _nullishCoalesce(((_b = options.stylex) == null ? void 0 : _b.useCSSLayers), () => ( false)));
+            const stylexRules = _nullishCoalesce(_chunk45JWH4GZcjs.stylexRulesStore.get(_chunk45JWH4GZcjs.STORE_KEY), () => ( {}));
+            const collectedCSS = _chunk45JWH4GZcjs.buildStylexRules.call(void 0, stylexRules, _nullishCoalesce(((_b = options.stylex) == null ? void 0 : _b.useCSSLayers), () => ( false)));
             res.setHeader("Content-Type", "text/css");
             res.setHeader("Cache-Control", "no-cache");
             res.end(_nullishCoalesce(collectedCSS, () => ( "")));

package/dist/astro.d.ts

@@ -1,13 +1,41 @@
-import { UnpluginStylexOptions } from './types.js';
-import '@babel/core';
-import '@stylexjs/babel-plugin';
-
 /**
  * This entry file is for astro plugin.
  *
  * @module
  */
-
+import type { IncomingMessage, ServerResponse } from 'node:http';
+import type { UnpluginStylexOptions } from './types';
+type AstroConfigSetupContext = {
+    config: {
+        base?: string;
+        build?: {
+            assets?: string;
+        };
+        vite: {
+            plugins?: unknown[];
+            ssr?: {
+                noExternal?: unknown;
+            };
+        };
+    };
+    updateConfig: (config: {
+        vite: {
+            ssr: {
+                noExternal: string[];
+            };
+        };
+    }) => void;
+    injectScript: (stage: string, content: string) => void;
+};
+type AstroServerSetupContext = {
+    server: {
+        middlewares: {
+            use: (handler: (req: IncomingMessage & {
+                url?: string;
+            }, res: ServerResponse, next: () => void) => void) => void;
+        };
+    };
+};
 /**
  * Astro plugin
  *
@@ -22,18 +50,12 @@ import '@stylexjs/babel-plugin';
  *   ],
  * })
  */
-declare function astro(options?: UnpluginStylexOptions): {
+export default function astro(options?: UnpluginStylexOptions): {
     name: string;
     hooks: {
-        'astro:config:setup': ({ config, updateConfig, injectScript }: {
-            config: any;
-            updateConfig: any;
-            injectScript: any;
-        }) => Promise<void>;
-        'astro:server:setup': ({ server }: {
-            server: any;
-        }) => void;
+        'astro:config:setup': ({ config, updateConfig, injectScript }: AstroConfigSetupContext) => Promise<void>;
+        'astro:server:setup': ({ server }: AstroServerSetupContext) => void;
     };
 };
-
-export { astro as default };
+export {};
+//# sourceMappingURL=astro.d.ts.map

package/dist/astro.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"astro.d.ts","sourceRoot":"","sources":["../src/astro.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAGhE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAIpD,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE;QACN,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,KAAK,CAAC,EAAE;YACN,MAAM,CAAC,EAAE,MAAM,CAAA;SAChB,CAAA;QACD,IAAI,EAAE;YACJ,OAAO,CAAC,EAAE,OAAO,EAAE,CAAA;YACnB,GAAG,CAAC,EAAE;gBACJ,UAAU,CAAC,EAAE,OAAO,CAAA;aACrB,CAAA;SACF,CAAA;KACF,CAAA;IACD,YAAY,EAAE,CAAC,MAAM,EAAE;QACrB,IAAI,EAAE;YACJ,GAAG,EAAE;gBACH,UAAU,EAAE,MAAM,EAAE,CAAA;aACrB,CAAA;SACF,CAAA;KACF,KAAK,IAAI,CAAA;IACV,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACvD,CAAA;AAED,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE;QACN,WAAW,EAAE;YACX,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,GAAG,EAAE,eAAe,GAAG;gBAAE,GAAG,CAAC,EAAE,MAAM,CAAA;aAAE,EAAE,GAAG,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,KAAK,IAAI,CAAA;SACjH,CAAA;KACF,CAAA;CACF,CAAA;AAED;;;;;;;;;;;;;GAaG;AAEH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,OAAO,GAAE,qBAA0B;;;uEAQU,uBAAuB;2CAyDzD,uBAAuB;;EA2B/D"}

package/dist/astro.js

@@ -1,6 +1,6 @@
 import {
   vite_default
-} from "./chunk-WUKLRLI4.js";
+} from "./chunk-5RGNKABP.js";
 import {
   PLUGIN_NAME,
   STORE_KEY,
@@ -9,13 +9,13 @@ import {
   getStylexAssetFileName,
   getStylexPublicPath,
   stylexRulesStore
-} from "./chunk-FEGNQ7CQ.js";
+} from "./chunk-SSMUIUHR.js";
 import "./chunk-6F4PWJZI.js";
 
 // src/astro.ts
 function astro(options = {}) {
   const configured = getOptions({ ...options, framework: "vite" });
-  const filename = configured.stylex.filename;
+  const filename = configured.stylex.filename ?? "stylex.css";
   return {
     name: PLUGIN_NAME,
     hooks: {

package/dist/{chunk-KKH6K7RE.cjs → chunk-45JWH4GZ.cjs}

@@ -429,10 +429,13 @@ var transformers = {
 // src/index.ts
 var unpluginFactory = (rawOptions, meta) => {
   const options = getOptions({ ...rawOptions || {}, framework: meta.framework });
+  const stylexFilename = _nullishCoalesce(options.stylex.filename, () => ( "stylex.css"));
+  const stylexImports = _nullishCoalesce(options.stylex.stylexImports, () => ( ["@stylexjs/stylex"]));
+  const useCSSLayers = _nullishCoalesce(options.stylex.useCSSLayers, () => ( false));
   if (!stylexRulesStore.has(STORE_KEY)) {
     stylexRulesStore.set(STORE_KEY, {});
   }
-  const stylexRules = stylexRulesStore.get(STORE_KEY);
+  const stylexRules = _nullishCoalesce(stylexRulesStore.get(STORE_KEY), () => ( {}));
   let viteConfig = null;
   return {
     name: PLUGIN_NAME,
@@ -449,7 +452,7 @@ var unpluginFactory = (rawOptions, meta) => {
       const normalizedFile = normalizePath(file);
       const normalizedId = normalizePath(id);
       const extname2 = path3.extname(file).slice(1);
-      if (!options.stylex.stylexImports.some((importName) => code.includes(importName))) {
+      if (!stylexImports.some((importName) => code.includes(importName))) {
         return;
       }
       const context = {
@@ -468,12 +471,12 @@ var unpluginFactory = (rawOptions, meta) => {
         return result;
       } catch (error) {
         console.error("transform::error::", error);
-        this.error(error);
+        this.error(error instanceof Error ? error.message : String(error));
       }
     },
     buildEnd() {
-      const fileName = options.stylex.filename;
-      const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+      const fileName = stylexFilename;
+      const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
       if (!collectedCSS) return;
       this.emitFile({
         fileName,
@@ -495,14 +498,14 @@ var unpluginFactory = (rawOptions, meta) => {
             next();
             return;
           }
-          const fileName = getStylexAssetFileName(options.stylex.filename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
+          const fileName = getStylexAssetFileName(stylexFilename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
           const cssPath = getStylexPublicPath(viteConfig == null ? void 0 : viteConfig.base, fileName);
           const basePath = (_nullishCoalesce((viteConfig == null ? void 0 : viteConfig.base), () => ( "/"))).replace(/\/+$/, "") || "/";
-          const filename = options.stylex.filename;
+          const filename = stylexFilename;
           const normalizedUrl = req.url.split("?")[0];
           const isCSSRequest = normalizedUrl === cssPath || normalizedUrl === `${basePath}/${filename}` || normalizedUrl === `/${filename}` || normalizedUrl.endsWith(`/${filename}`) || normalizedUrl === filename;
           if (isCSSRequest) {
-            const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+            const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
             res.setHeader("Content-Type", "text/css");
             res.setHeader("Cache-Control", "no-cache");
             res.end(collectedCSS || "");
@@ -513,8 +516,8 @@ var unpluginFactory = (rawOptions, meta) => {
       },
       buildEnd() {
         var _a;
-        const fileName = getStylexAssetFileName(options.stylex.filename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
-        const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+        const fileName = getStylexAssetFileName(stylexFilename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
+        const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
         if (!collectedCSS) return;
         this.emitFile({
           fileName,
@@ -524,7 +527,7 @@ var unpluginFactory = (rawOptions, meta) => {
       },
       transformIndexHtml(html, ctx) {
         var _a, _b;
-        const fileName = getStylexAssetFileName(options.stylex.filename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
+        const fileName = getStylexAssetFileName(stylexFilename, _nullishCoalesce(((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir), () => ( "assets")));
         const css = (_b = ctx.bundle) == null ? void 0 : _b[fileName];
         if (!css) {
           return html;

package/dist/{chunk-WUKLRLI4.js → chunk-5RGNKABP.js}

@@ -1,6 +1,6 @@
 import {
   unpluginFactory
-} from "./chunk-FEGNQ7CQ.js";
+} from "./chunk-SSMUIUHR.js";
 
 // src/vite.ts
 import { createVitePlugin } from "unplugin";

package/dist/{chunk-FEGNQ7CQ.js → chunk-SSMUIUHR.js}

@@ -429,10 +429,13 @@ var transformers = {
 // src/index.ts
 var unpluginFactory = (rawOptions, meta) => {
   const options = getOptions({ ...rawOptions || {}, framework: meta.framework });
+  const stylexFilename = options.stylex.filename ?? "stylex.css";
+  const stylexImports = options.stylex.stylexImports ?? ["@stylexjs/stylex"];
+  const useCSSLayers = options.stylex.useCSSLayers ?? false;
   if (!stylexRulesStore.has(STORE_KEY)) {
     stylexRulesStore.set(STORE_KEY, {});
   }
-  const stylexRules = stylexRulesStore.get(STORE_KEY);
+  const stylexRules = stylexRulesStore.get(STORE_KEY) ?? {};
   let viteConfig = null;
   return {
     name: PLUGIN_NAME,
@@ -449,7 +452,7 @@ var unpluginFactory = (rawOptions, meta) => {
       const normalizedFile = normalizePath(file);
       const normalizedId = normalizePath(id);
       const extname2 = path3.extname(file).slice(1);
-      if (!options.stylex.stylexImports.some((importName) => code.includes(importName))) {
+      if (!stylexImports.some((importName) => code.includes(importName))) {
         return;
       }
       const context = {
@@ -468,12 +471,12 @@ var unpluginFactory = (rawOptions, meta) => {
         return result;
       } catch (error) {
         console.error("transform::error::", error);
-        this.error(error);
+        this.error(error instanceof Error ? error.message : String(error));
       }
     },
     buildEnd() {
-      const fileName = options.stylex.filename;
-      const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+      const fileName = stylexFilename;
+      const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
       if (!collectedCSS) return;
       this.emitFile({
         fileName,
@@ -495,14 +498,14 @@ var unpluginFactory = (rawOptions, meta) => {
             next();
             return;
           }
-          const fileName = getStylexAssetFileName(options.stylex.filename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
+          const fileName = getStylexAssetFileName(stylexFilename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
           const cssPath = getStylexPublicPath(viteConfig == null ? void 0 : viteConfig.base, fileName);
           const basePath = ((viteConfig == null ? void 0 : viteConfig.base) ?? "/").replace(/\/+$/, "") || "/";
-          const filename = options.stylex.filename;
+          const filename = stylexFilename;
           const normalizedUrl = req.url.split("?")[0];
           const isCSSRequest = normalizedUrl === cssPath || normalizedUrl === `${basePath}/${filename}` || normalizedUrl === `/${filename}` || normalizedUrl.endsWith(`/${filename}`) || normalizedUrl === filename;
           if (isCSSRequest) {
-            const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+            const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
             res.setHeader("Content-Type", "text/css");
             res.setHeader("Cache-Control", "no-cache");
             res.end(collectedCSS || "");
@@ -513,8 +516,8 @@ var unpluginFactory = (rawOptions, meta) => {
       },
       buildEnd() {
         var _a;
-        const fileName = getStylexAssetFileName(options.stylex.filename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
-        const collectedCSS = buildStylexRules(stylexRules, options.stylex.useCSSLayers);
+        const fileName = getStylexAssetFileName(stylexFilename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
+        const collectedCSS = buildStylexRules(stylexRules, useCSSLayers);
         if (!collectedCSS) return;
         this.emitFile({
           fileName,
@@ -524,7 +527,7 @@ var unpluginFactory = (rawOptions, meta) => {
       },
       transformIndexHtml(html, ctx) {
         var _a, _b;
-        const fileName = getStylexAssetFileName(options.stylex.filename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
+        const fileName = getStylexAssetFileName(stylexFilename, ((_a = viteConfig == null ? void 0 : viteConfig.build) == null ? void 0 : _a.assetsDir) ?? "assets");
         const css = (_b = ctx.bundle) == null ? void 0 : _b[fileName];
         if (!css) {
           return html;