search

kristerkari / react-native-css-modules

Style React Native components using CSS, PostCSS, Sass, Less or Stylus.
MIT License
328 stars 21 forks source link

Web Bundling Fails when used with Expo Router #50

Open AaronHeth opened 7 months ago

AaronHeth commented 7 months ago

When used with Expo Router, Web bundling fails

Web Bundling failed 4470ms (node_modules/expo-router/entry.js)
error: node_modules/expo-router/_ctx.web.js: /node_modules/expo-router/_ctx.web.js: Expected `fromDir` to be of type `string`, got `undefined`

If I comment out the transformer and resolver from metro.config.js, the bundle can succeed.

const { getDefaultConfig } = require("expo/metro-config");

module.exports = (async () => {
  const {
    resolver: { sourceExts },
  } = await getDefaultConfig(__dirname);
  // return {
  //   transformer: {
  //     babelTransformerPath: require.resolve("react-native-css-transformer"),
  //   },
  //   resolver: {
  //     sourceExts: [...sourceExts, "css"],
  //   },
  // };
})();
kristerkari commented 5 months ago

Thanks!

That's probably because in the newest Expo version 50, they changed to using a custom Metro transformer, which is not yet supported by the react-native-css-transformer package. I need to have a look at updating the CSS/Sass/Less/Stylus transformers to support the newest Expo version.

kristerkari commented 5 months ago

I updated react-native-css-transformer to support Expo 50, so it should work now.

kristerkari commented 4 months ago

Actually, I does not work yet because Expo version 50/51 is doing some custom transformation for CSS files. I'm looking into it...