LogBox isn't available and app crashes

[nonameolsson]

---

What's going on?
It is not possible to start an app generated with Bowser 5.3 and Expo.

---

Steps to reproduce

1. ignite new MyApp -b bowser
2. Use Expo
3. Start the app in the emulator / phone.

---

ignite doctor results:

  platform           darwin
  arch               x64
  cpu                8 cores      Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
  directory          MyApp        /Users/andreasolsson/Code/MyApp
JavaScript
  node               12.18.2      /Users/andreasolsson/.asdf/installs/nodejs/12.18.2/bin/node
  npm                6.14.5       /Users/andreasolsson/.asdf/installs/nodejs/12.18.2/bin/npm
  yarn               1.22.4       /Users/andreasolsson/.yarn/bin/yarn
Ignite
  ignite-cli           3.5.2              /Users/andreasolsson/.asdf/installs/nodejs/12.18.2/.npm/bin/ignite
  ignite src           build              /Users/andreasolsson/.config/yarn/global/node_modules/ignite-cli/build
  navigation           react-navigation
  generators
                       component          ignite-bowser
                       model              ignite-bowser
                       navigator          ignite-bowser
                       screen             ignite-bowser
  createdWith          3.5.2
  boilerplate          ignite-bowser
  boilerplateVersion   5.3.0
Android
  java               14.0.2       /usr/bin/java
  android home       -            undefined
iOS
  xcode              11.6
  cocoapods          1.9.3        /usr/local/bin/pod

[nonameolsson]

After some investigation, this is my conclusion.

Expo
This boilerplate uses the latest version of Expo (SDK 38). That version of Expo only supports up to React Native 0.62.
Reference: https://blog.expo.io/expo-sdk-38-is-now-available-ab6cd30ca2ee

Without Expo
When generating an app without Expo, this boilerplate uses React Native 0.63.2.

LogBox
With or without Expo, this boilerplate contains code only available in React Native 0.63.x.

import { LogBox } from "react-native"

// prettier-ignore
LogBox.ignoreLogs([
  "Require cycle:",
])

https://github.com/infinitered/ignite-bowser/blob/d853af5e084fd464eefbdfdb036d7c206699b248/boilerplate/app/utils/ignore-warnings.ts

Conclusion
The boilerplate should not use features from React Native 0.63.x when using Expo. I'm not sure how this could be improved to avoid issues like this when an app can be generated with Expo.

I suppose that Expo always will support older versions of React Native. Could one suggestion be to make sure only to use feature that Expo supports?

[bryanstearns]

Thanks for the detailed report! 🎉

We should definitely consider Expo SDK support when enhancing Bowser - but rather than holding non-Expo Bowser apps back, I think it'd be better to condition specific features when there's a conflict.

In this case, we could rename ignore-warnings.ts to ignore-warnings.ts.ejs and conditionalize the content to use the old YellowBox when generating an Expo app; storage.ts.ejs has useExpo conditionals in it already if an example would help. You'll need to add to the templates list in boilerplate.ts too.

[nonameolsson]

Thanks! Sounds like a good way to handle this! I'm on it!

[infinitered-circleci]

🎉 This issue has been resolved in version 5.4.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀