Storybook: React Native 0.58 crashing from node core module reference in dependency

[ryanmagoon]

Describe the bug
It looks like safe-eval, a module required by telejson, requires vm, which is a core node module and can't be used in the metro bundler without some kind of polyfill, so maybe a different library should be used there or telejson should be modified

To Reproduce
Steps to reproduce the behavior:
set up a new storybook project in a brand new react native project
npx -p @storybook/cli@next sb init

Expected behavior
the default ui setup to be there and working

Screenshots

Code snippets
The offending file:

System:

• OS: MacOS
• Device: MacBook Pro 2015
• Framework: react-native
• Version: 5.0.0-alpha.9

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[shilman]

cc @Gongreg

[nemonweb]

Because of this bug it is not possible to use storybook 5.x with react native. Fix it please

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[shilman]

We’ve released a brand new @storybook/react-native with a bunch of core improvements. It’s available in the latest 5.1-alpha on next and has been verified by several RN users on their existing apps. It should fix a bunch of compatibility issues, especially if you’re using the web server feature. Please give it a try and comment here if it fixes your problem. Migration instructions available here: https://github.com/storybooks/storybook/blob/next/MIGRATION.md#react-native-server

@ryanmagoon @tsvetan-ganev @Aleksefo @hugofovargue @nemonweb @FLGMwt @thamo01 @loic-lopez @stale

[FLGMwt]

Thanks for the update! Will try it out in the next few days : )

EDIT:

JK, saw that the migration steps were just "upgrade" :p

Tried that and it seems like I'm getting a similar channel issue to what I was getting when I was debugging before and worked around the first safe-eval error @.ryanmagoon described.

undefined is not an object (evaluating '_addons.default.setChannel')
getStorybookUI
    index.js:272:24
<unknown>
    index.js:7:39
loadModuleImplementation
    require.js:321:6
<unknown>
    index.js:6:13
loadModuleImplementation
    require.js:321:6
guardedLoadModule
    require.js:199:45
global code

Which seems to map to this line:

https://github.com/storybooks/storybook/blob/v5.1.0-alpha.12/app/react-native/src/preview/index.js#L89

react-native info

  React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.6
      CPU: x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
      Memory: 67.24 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 11.0.0 - /usr/local/bin/node
      Yarn: 1.15.2 - ~/.yarn/bin/yarn
      npm: 6.9.0 - /usr/local/bin/npm
      Watchman: 4.5.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
      Android SDK:
        Build Tools: 21.1.2, 23.0.1, 24.0.0, 24.0.3, 25.0.0, 25.0.1, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.2, 27.0.3, 28.0.2, 28.0.3
        API Levels: 21, 23, 24, 25, 26, 27, 28
    IDEs:
      Android Studio: 3.3 AI-182.5107.16.33.5314842
      Xcode: 10.1/10B61 - /usr/bin/xcodebuild
    npmPackages:
      @storybook/react-native: ^5.1.0-alpha.12 => 5.1.0-alpha.12
      react: 16.6.1 => 16.6.1
      react-native: ^0.58.6 => 0.58.6
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1
      react-native-git-upgrade: 0.2.7

"@storybook/react-native": "^5.1.0-alpha.12",

[nemonweb]

@shilman 5.1-alpha works fine. Thanks

[shilman]

That was fast @FLGMwt! Technically "in the next few days" I suppose 😆

Hmm.. seems like it's working for @nemonweb

Sometimes the channel can be null if there are multiple versions of things installed. Can you try removing your node_modules completely and possibly even yarn.lock if that doesn't work and see if that solves the problem?

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[shilman]

Closing. Please comment if you're still seeing this problem on recent alphas