@stylexswc/webpack-plugin 0.14.0-rc.1 → 0.14.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/README.md +36 -0
  2. package/dist/index.d.ts +6 -5
  3. package/dist/index.d.ts.map +1 -1
  4. package/dist/index.js +7 -3
  5. package/dist/types.d.ts +11 -0
  6. package/dist/types.d.ts.map +1 -1
  7. package/package.json +5 -5
package/README.md CHANGED
@@ -152,6 +152,37 @@ module.exports = config;
152
152
  - Description: Custom CSS transformation function. Since the plugin injects CSS
153
153
  after all loaders, use this to apply PostCSS or other CSS transformations.
154
154
 
155
+ #### `cacheGroup`
156
+
157
+ - Type: `CacheGroupOptions` (webpack cache group configuration)
158
+ - Optional
159
+ - Description: Allows overriding the default webpack cache group parameters for StyleX CSS extraction.
160
+ By default, the plugin creates a dedicated cache group named `stylex` for extracted StyleX CSS.
161
+ Use this option to customize cache group behavior such as chunk naming, priority, or other split chunks options.
162
+
163
+ **Default cache group configuration:**
164
+ ```javascript
165
+ {
166
+ name: 'stylex',
167
+ test: /\.stylex\.virtual\.css$/,
168
+ type: 'css/mini-extract',
169
+ chunks: 'all',
170
+ enforce: true,
171
+ }
172
+ ```
173
+
174
+ **Example - Custom cache group:**
175
+ ```javascript
176
+ new StylexPlugin({
177
+ cacheGroup: {
178
+ name: 'my-stylex-bundle',
179
+ chunks: 'initial',
180
+ priority: 20,
181
+ enforce: true,
182
+ },
183
+ })
184
+ ```
185
+
155
186
  ### Example Configuration
156
187
 
157
188
  ```javascript
@@ -176,6 +207,11 @@ module.exports = {
176
207
  const result = await postcss([require('autoprefixer')]).process(css);
177
208
  return result.css;
178
209
  },
210
+ // Optional: Override cache group settings
211
+ cacheGroup: {
212
+ name: 'stylex',
213
+ priority: 30,
214
+ },
179
215
  }),
180
216
  ],
181
217
  };
package/dist/index.d.ts CHANGED
@@ -1,17 +1,18 @@
1
- import { VIRTUAL_CSS_PATTERN } from './constants';
1
+ import { STYLEX_CHUNK_NAME, VIRTUAL_CSS_PATTERN } from './constants';
2
2
  import type webpack from 'webpack';
3
3
  import type { Rule as StyleXRule } from '@stylexjs/babel-plugin';
4
- import type { CSSTransformer, StyleXPluginOption, StyleXWebpackLoaderOptions } from './types';
4
+ import type { CSSTransformer, StyleXPluginOption, StyleXWebpackLoaderOptions, CacheGroupOptions } from './types';
5
5
  export type RegisterStyleXRules = (_resourcePath: string, _stylexRules: StyleXRule[]) => void;
6
6
  export default class StyleXPlugin {
7
7
  stylexRules: Map<string, readonly StyleXRule[]>;
8
8
  useCSSLayers: boolean;
9
9
  loaderOption: StyleXWebpackLoaderOptions;
10
+ cacheGroup?: CacheGroupOptions;
10
11
  transformCss: CSSTransformer;
11
12
  loaderOrder: StyleXPluginOption['loaderOrder'];
12
- constructor({ stylexImports, useCSSLayers, rsOptions, nextjsMode, transformCss, extractCSS, loaderOrder, }?: StyleXPluginOption);
13
+ constructor({ stylexImports, useCSSLayers, rsOptions, nextjsMode, transformCss, extractCSS, loaderOrder, cacheGroup, }?: StyleXPluginOption);
13
14
  apply(compiler: webpack.Compiler): void;
14
15
  }
15
- export { VIRTUAL_CSS_PATTERN };
16
- export type { StyleXPluginOption } from './types';
16
+ export { VIRTUAL_CSS_PATTERN, STYLEX_CHUNK_NAME };
17
+ export type { StyleXPluginOption, CacheGroupOptions } from './types';
17
18
  //# sourceMappingURL=index.d.ts.map
package/dist/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAML,mBAAmB,EACpB,MAAM,aAAa,CAAC;AAGrB,OAAO,KAAK,OAAO,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,KAAK,EACV,cAAc,EACd,kBAAkB,EAClB,0BAA0B,EAE3B,MAAM,SAAS,CAAC;AAkBjB,MAAM,MAAM,mBAAmB,GAAG,CAAC,aAAa,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;AAE9F,MAAM,CAAC,OAAO,OAAO,YAAY;IAC/B,WAAW,qCAA4C;IACvD,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,0BAA0B,CAAC;IAEzC,YAAY,EAAE,cAAc,CAAC;IAC7B,WAAW,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;gBACnC,EACV,aAA8C,EAC9C,YAAoB,EACpB,SAAc,EACd,UAAkB,EAClB,YAAgC,EAChC,UAAiB,EACjB,WAAqB,GACtB,GAAE,kBAAuB;IAoB1B,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,QAAQ;CAwKjC;AAED,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,YAAY,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAIL,iBAAiB,EAEjB,mBAAmB,EACpB,MAAM,aAAa,CAAC;AAGrB,OAAO,KAAK,OAAO,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,KAAK,EACV,cAAc,EACd,kBAAkB,EAClB,0BAA0B,EAE1B,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAkBjB,MAAM,MAAM,mBAAmB,GAAG,CAAC,aAAa,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;AAE9F,MAAM,CAAC,OAAO,OAAO,YAAY;IAC/B,WAAW,qCAA4C;IACvD,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,0BAA0B,CAAC;IACzC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,YAAY,EAAE,cAAc,CAAC;IAC7B,WAAW,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;gBACnC,EACV,aAA8C,EAC9C,YAAoB,EACpB,SAAc,EACd,UAAkB,EAClB,YAAgC,EAChC,UAAiB,EACjB,WAAqB,EACrB,UAAU,GACX,GAAE,kBAAuB;IAqB1B,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,QAAQ;CAuKjC;AAED,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,CAAC;AAElD,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}
package/dist/index.js CHANGED
@@ -3,10 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.VIRTUAL_CSS_PATTERN = void 0;
6
+ exports.STYLEX_CHUNK_NAME = exports.VIRTUAL_CSS_PATTERN = void 0;
7
7
  const babel_plugin_1 = __importDefault(require("@stylexjs/babel-plugin"));
8
8
  const path_1 = __importDefault(require("path"));
9
9
  const constants_1 = require("./constants");
10
+ Object.defineProperty(exports, "STYLEX_CHUNK_NAME", { enumerable: true, get: function () { return constants_1.STYLEX_CHUNK_NAME; } });
10
11
  Object.defineProperty(exports, "VIRTUAL_CSS_PATTERN", { enumerable: true, get: function () { return constants_1.VIRTUAL_CSS_PATTERN; } });
11
12
  const rs_compiler_1 = require("@stylexswc/rs-compiler");
12
13
  const stylexLoaderPath = require.resolve('./stylex-loader');
@@ -24,9 +25,10 @@ class StyleXPlugin {
24
25
  stylexRules = new Map();
25
26
  useCSSLayers;
26
27
  loaderOption;
28
+ cacheGroup;
27
29
  transformCss;
28
30
  loaderOrder;
29
- constructor({ stylexImports = ['stylex', '@stylexjs/stylex'], useCSSLayers = false, rsOptions = {}, nextjsMode = false, transformCss = identityTransfrom, extractCSS = true, loaderOrder = 'first', } = {}) {
31
+ constructor({ stylexImports = ['stylex', '@stylexjs/stylex'], useCSSLayers = false, rsOptions = {}, nextjsMode = false, transformCss = identityTransfrom, extractCSS = true, loaderOrder = 'first', cacheGroup, } = {}) {
30
32
  this.useCSSLayers = useCSSLayers;
31
33
  this.loaderOption = {
32
34
  stylexImports,
@@ -44,6 +46,7 @@ class StyleXPlugin {
44
46
  };
45
47
  this.transformCss = transformCss;
46
48
  this.loaderOrder = loaderOrder;
49
+ this.cacheGroup = cacheGroup;
47
50
  }
48
51
  apply(compiler) {
49
52
  // If splitChunk is enabled, we create a dedicated chunk for stylex css
@@ -54,7 +57,7 @@ class StyleXPlugin {
54
57
  ].join(' '));
55
58
  }
56
59
  compiler.options.optimization.splitChunks.cacheGroups ??= {};
57
- compiler.options.optimization.splitChunks.cacheGroups[constants_1.STYLEX_CHUNK_NAME] = {
60
+ compiler.options.optimization.splitChunks.cacheGroups[constants_1.STYLEX_CHUNK_NAME] = this.cacheGroup ?? {
58
61
  name: constants_1.STYLEX_CHUNK_NAME,
59
62
  test: constants_1.VIRTUAL_CSS_PATTERN,
60
63
  type: 'css/mini-extract',
@@ -173,3 +176,4 @@ module.exports.default = StyleXPlugin;
173
176
  module.exports.loader = stylexLoaderPath;
174
177
  module.exports.virtualLoader = stylexVirtualLoaderPath;
175
178
  module.exports.VIRTUAL_CSS_PATTERN = constants_1.VIRTUAL_CSS_PATTERN;
179
+ module.exports.STYLEX_CHUNK_NAME = constants_1.STYLEX_CHUNK_NAME;
package/dist/types.d.ts CHANGED
@@ -2,6 +2,7 @@ import type { StyleXOptions } from '@stylexswc/rs-compiler';
2
2
  import type { LoaderContext } from 'webpack';
3
3
  import type webpack from 'webpack';
4
4
  import type { RegisterStyleXRules } from '.';
5
+ export type CacheGroupOptions = NonNullable<Exclude<Exclude<webpack.Configuration['optimization'], undefined>['splitChunks'], undefined | false>['cacheGroups']>[string];
5
6
  type AsyncFnParams = Parameters<ReturnType<LoaderContext<unknown>['async']>>;
6
7
  export type InputCode = AsyncFnParams['1'];
7
8
  export type SourceMap = AsyncFnParams['2'];
@@ -54,6 +55,16 @@ export interface StyleXPluginOption {
54
55
  * @default 'first'
55
56
  */
56
57
  loaderOrder?: 'first' | 'last';
58
+ /**
59
+ * Customizes the cache group configuration for extracted CSS chunks.
60
+ *
61
+ * Allows you to override or extend the default webpack `splitChunks.cacheGroups` settings
62
+ * for CSS generated by StyleX. This can be used to control how CSS is split into separate
63
+ * files, optimize caching, or group styles according to your application's needs.
64
+ *
65
+ * @see https://webpack.js.org/plugins/split-chunks-plugin/#splitchunkscachegroups
66
+ */
67
+ cacheGroup?: CacheGroupOptions;
57
68
  }
58
69
  export type StyleXWebpackLoaderOptions = {
59
70
  stylexImports: StyleXOptions['importSources'];
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,OAAO,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,KAAK,aAAa,GAAG,UAAU,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAE7E,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;AAC3C,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;AAE3C,MAAM,MAAM,cAAc,GAAG,CAC3B,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,MAAM,GAAG,SAAS,KAC1B,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;AAEhD,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IAC/C;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;IAE9B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAChC;AACD,MAAM,MAAM,0BAA0B,GAAG;IACvC,aAAa,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IAC9C,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,yBAAyB,CAAC,OAAO,GAAG,OAAO,IAAI,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,GAAG;IAC1F,uBAAuB,EAAE;QACvB,mBAAmB,EAAE,mBAAmB,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;KAAE,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,OAAO,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,MAAM,MAAM,iBAAiB,GAAG,WAAW,CACzC,OAAO,CACL,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC,aAAa,CAAC,EACxE,SAAS,GAAG,KAAK,CAClB,CAAC,aAAa,CAAC,CACjB,CAAC,MAAM,CAAC,CAAC;AAEV,KAAK,aAAa,GAAG,UAAU,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAE7E,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;AAC3C,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;AAE3C,MAAM,MAAM,cAAc,GAAG,CAC3B,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,MAAM,GAAG,SAAS,KAC1B,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;AAEhD,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IAC/C;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;IAE9B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AACD,MAAM,MAAM,0BAA0B,GAAG;IACvC,aAAa,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC;IAC9C,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,yBAAyB,CAAC,OAAO,GAAG,OAAO,IAAI,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,GAAG;IAC1F,uBAAuB,EAAE;QACvB,mBAAmB,EAAE,mBAAmB,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;KAAE,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@stylexswc/webpack-plugin",
3
3
  "description": "StyleX webpack plugin with NAPI-RS compiler",
4
- "version": "0.14.0-rc.1",
4
+ "version": "0.14.0-rc.3",
5
5
  "private": false,
6
6
  "license": "MIT",
7
7
  "sideEffects": false,
@@ -18,14 +18,14 @@
18
18
  }
19
19
  },
20
20
  "dependencies": {
21
- "@stylexjs/babel-plugin": "^0.17.2",
22
- "@stylexswc/rs-compiler": "0.14.0-rc.1",
21
+ "@stylexjs/babel-plugin": "^0.17.3",
22
+ "@stylexswc/rs-compiler": "0.14.0-rc.3",
23
23
  "loader-utils": "^3.3.1"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@babel/types": "^7.28.5",
27
- "@stylexswc/eslint-config": "0.14.0-rc.1",
28
- "@stylexswc/typescript-config": "0.14.0-rc.1",
27
+ "@stylexswc/eslint-config": "0.14.0-rc.3",
28
+ "@stylexswc/typescript-config": "0.14.0-rc.3",
29
29
  "@types/babel__core": "^7.20.5",
30
30
  "@types/loader-utils": "^3.0.0",
31
31
  "@types/node": "^24.10.1",