react-native icon indicating copy to clipboard operation
react-native copied to clipboard

Expo + Storybook Bundler Issue metro config

Open ian-etgo opened this issue 1 week ago • 1 comments

When adding storybook to the metro.config.json

This error is seen:

Image

Expo: "expo": "^54.0.27", Storybook version: "storybook": "^10.1.4",

const { getDefaultConfig } = require('expo/metro-config');
const { withNativeWind } = require('nativewind/metro');
const {
  withStorybook,
} = require('@storybook/react-native/metro/withStorybook');

const config = getDefaultConfig(__dirname);
const { transformer, resolver } = config;

const transformedResolvedConfig = {
  transformer: {
    ...transformer,
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },

  resolver: {
    ...resolver,
    assetExts: resolver.assetExts.filter(ext => ext !== 'svg'),
    sourceExts: [...resolver.sourceExts, 'ts', 'tsx', 'js', 'jsx', 'svg'],
  },
};

const nativeWindConfig = withNativeWind(transformedResolvedConfig, {
  input: './global.css',
});

//this must be commented out
// const storybookconfig =  withStorybook(nativeWindConfig);

module.exports = nativeWindConfig;

ian-etgo avatar Dec 07 '25 12:12 ian-etgo

Can you provide a reproduction? theres not much to go off of here unfortunately.

dannyhw avatar Dec 07 '25 13:12 dannyhw