Any updates for StyleX 0.10.0

[derekjwilliams]

This is an amazing set of packages, thanks so much

Just saw that StyleX 0.10.0 dropped (January 2, 2025). Any updates needed for this version?

I'm using version 0.5.1 of the packages, which seems to be working fine, package.json files:

"devDependencies": {
    "@stylexjs/eslint-plugin": "^0.10.0",
    "@stylexswc/nextjs-plugin": "^0.5.1",
    "@stylexswc/rs-compiler": "^0.5.1",

My next.config.js (I'm also using open-props):

/** @type {import('next').NextConfig} */
const stylexPlugin = require('@stylexswc/nextjs-plugin')
const rootDir = __dirname
const path = require('path')
const nextConfig = {
  reactStrictMode: true,
  pageExtensions: ['js', 'jsx', 'ts', 'tsx'],
  images: {
    remotePatterns: [
      // hidden
    ],
    formats: ['image/webp'],
  },
}
module.exports = stylexPlugin({
  rsOptions: {
    dev: process.env.NODE_ENV !== 'production',
    useRemForFontSize: true,
    aliases: {
      '@/*': [path.join(rootDir, '*')],
    },
    unstable_moduleResolution: {
      type: 'commonJS',
      rootDir,
    },
  },
  useCssLayers: true,
  transformCss: async (css) => {
    const postcss = require('postcss')
    const result = await postcss([require('autoprefixer')]).process(css)
    return result.css
  },
})({
  ...nextConfig,
  transpilePackages: ['@stylexjs/open-props'],
})

Yes, I have unstable_moduleResolution in there twice, only one should be present, but the docs for ...still has this. Apparently StyleX 0.10.0 does not need unstable_moduleResolution.rootDir any more, so I think this can be removed?

Edit, removed a second unstable_moduleResolution, which was an error on my part

Here are the release notes for StyleX 0.10.0

https://github.com/facebook/stylex/blob/1608c894bf26d7100962e4d3f28f8c45c1038b5b/apps/docs/blog/2025-01-02-Release-v0.10.0.mdx

Note, that this says

StyleX previously required manual configuration of unstable_moduleResolution.rootDir for enabling the theming APIs. This is no longer the case. Additionally, compilation should be more reliable and cache-friendly, especially when using package managers like pnpm

The moduleResolution docs for version 0.5.1 of @stylexswc/nextjs-plugin still has unstable_moduleResolution.rootDir configuration:

aliases: {
      '@/*': [path.join(rootDir, '*')],
    },
    unstable_moduleResolution: {
      type: 'commonJS',
      rootDir,
    },

From here: https://www.npmjs.com/package/@stylexswc/nextjs-plugin#plugin-options

[Dwlad90]

Hi @derekjwilliams,
Thanks for your interest in this plugin.

The features and fixes from [email protected] are almost complete and will be published soon in the next release.

As for unstable_moduleResolution, I will try to make this parameter optional as well, but there may be difficulties with path resolution, since I do not have the ability to run NodeJS to work with paths and take advantage of its work with different package managers.

[derekjwilliams]

Thanks so much,

Making unstable_moduleResolution optional is not a priority at all (for me), but I can understand that it would be nice.

[Dwlad90]

I managed to implement the updated logic from StyleX and now rootDir parameter is indeed optional.

I will try to publish an RC version with all the features from [email protected] soon.

[Dwlad90]

The RC version has been published to npm. Happy coding🙂

[derekjwilliams]

Beautiful