react-native: Crash: `undefined is not an object (evaluating '_this.props.updateCellsBatchingPeriod')` when using @babel/proposal-decorators
Describe the bug
Once i provision Storybook into a brand new React Native app (via react native cli, not expo), add @babel/plugin-proposal-decorators to dev dependencies, and provision the plugin in babel.config.js, app builds but crashes on launch (see screenshot).
To Reproduce Steps to reproduce the behavior:
npx react-native init StorybookIssue && cd StorybookIssuenpx -p @storybook/cli sb init --type react_native- add
export {default} from './storybook';to App.js; comment/removeexport default App; yarn add -D @babel/plugin-proposal-decoratorscd ios && pod install && cd ..open ios/StorybookIssue.xcworkspace/- Run app on xcode
- see crash
Expected behavior See Storybook Demo preview (“Hello Button”). Happy to provide a repo to repro the issue, but i figured repro steps were simple enough.
Screenshots

Code snippets
// babel.config.js
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [['@babel/proposal-decorators', {decoratorsBeforeExport: true}]],
};
System
Environment Info:
System:
OS: macOS 10.15.7
CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
Binaries:
Node: 12.16.3 - ~/.nvm/versions/node/v12.16.3/bin/node
Yarn: 1.22.5 - /usr/local/bin/yarn
npm: 6.14.4 - ~/.nvm/versions/node/v12.16.3/bin/npm
Browsers:
Chrome: 86.0.4240.193
Safari: 14.0
npmPackages:
@storybook/addon-actions: ^5.3 => 5.3.21
@storybook/addon-knobs: ^5.3 => 5.3.21
@storybook/addon-links: ^5.3 => 5.3.21
@storybook/addon-ondevice-actions: ^5.3.23 => 5.3.23
@storybook/addon-ondevice-knobs: ^5.3.23 => 5.3.23
@storybook/react-native: ^5.3.23 => 5.3.23
@storybook/react-native-server: ^5.3.23 => 5.3.23
Additional context
There’s no issue using legacy: true option for plugin, but unfortunately the app i’m adding storybook to uses decoratorsBeforeExport: true option. The repro steps are for a brand new app (for testing). Existing app works fine with this babel plugin.
About this issue
- Original URL
- State: open
- Created 4 years ago
- Comments: 15 (7 by maintainers)
@dannyhw Aw… I solved my issue while trying to create a project for reproduction. So I was following the suggested blog post to create multiple entry points for sb and main app. I was missing
import "reflect-metadata";in the new entry point which was crucial for inversify to work. It is working now without issue. Thanks for the quick response!Thanks @WookieFPV. Ended up using the same fix, but unfortunately not having this plugin makes MobX a bit more annoying to use.
I had the same issue, but the cause was another babel plugin:
@babel/plugin-proposal-class-propertiesRemoving it fixed this issue for me
@badkos hey, like I said I don’t really know anything about these decorators so if anyone can provide more information about why this might not be working that would help a lot. Otherwise I will need to just blindly debug this without knowing where to start. I appreciate that this might be frustrating but I’ll try to debug this at some point when I have time and hopefully I can find out something.
If anyone is able to offer their time to help on this issue that would be greatly appreciated, the contributing docs should help you get started 😃.
@jeremyeaton89 ok no problem 😃 I’ll leave it here for now and if we get no activity for a while then I’ll close it 👍