Hello Princiya,

Sorry for not explaining how to do it in the post itself, it would have increased the length of it by quite a lot. I was thinking about writing a separate post to explain how to do it. But here is a short summary:

The first thing that pops in my head is to use custom extensions for production build (https://github.com/facebook/react-native/pull/16948). This functionality is supported from React Native version 0.55.x. If you are using an older version there is a hack my colleagues created “https://github.com/wix/react-native-repackager”. To sum up you would create “storybook.empty.js” file next to storybook.js file and use — customExts=empty.js or set it through rn-config.js file:

module.exports = {
 getSourceExts: () => process.env.RN_FLAVOR === 'PRODUCTION' ? ['empty.js'] : []
}

This functionality covered all of our cases when we wanted to exclude some code from production bundle or use some additional code in our e2e tests.

If you have some reason why you cannot use this solution you could write some kind of script which simply removes the code itself before creating production bundle. But this is just an idea and I’ve not did this myself.

And I guess there are more ways to solve it that I just don’t remember. You just have to remember that there are no dynamic imports in React Native and work around that.

And of course if you do not really care about the bundle size itself you may just leave it there. I am not sure how much impact to the size the storybook has for the bundle.

I hope this helps.