vitalets / react-native-extended-stylesheet

Extended StyleSheets for React Native
MIT License
2.93k stars 132 forks source link

Does not build layout on first load, Upgraded from React-Native 0.57.7 to 0.59.9 #110

Closed jibraniqbal666 closed 5 years ago

jibraniqbal666 commented 5 years ago

Steps to Reproduce

  1. Describe steps Recently upgraded from 0.57.7 to 0.59.9. Only appeared in iOS
  2. to reproduce Recently upgraded from 0.57.7 to 0.59.9
  3. the issue On first build it does not build layout, that is why screen looks ugly as not styles applied. Works on reload (Debug) Do not work on Release mode completely .

Try in Expo

Expected Behavior

Does not build layout on first load.

Actual Behavior

should build layout on first load.

Show the code

Environment

"react": "16.8.3",
"react-native": "0.59.9",
"react-native-async-storage": "github:react-native-community/async-storage",
"react-native-autocomplete-search": "^1.0.8",
"react-native-collapsible": "^1.4.0",
"react-native-confirmation-code-input": "^1.0.4",
"react-native-extended-stylesheet": "^0.11.2",
vitalets commented 5 years ago

hi @jibraniqbal666 Could you check with fresh install of RN 0.59.9 is this behavior exists?

Rodrigo77777 commented 5 years ago

I just checked a fresh install on 0.59.10, seems EStyleSheet.create is not creating the style objects within it correctly? Cannot read property 'width' of undefined.

jibraniqbal666 commented 5 years ago

@Rodrigo77777 thanks for checking out, I was busy, that is why I was not able to send reproducible procedure on the bug. it is definitely a bug, we use Dimension.get('screen') to get the width for now.

Rodrigo77777 commented 5 years ago

@jibraniqbal666 Seems like it might be an issue with percentage values on the width right? EDIT: Changed from width value to Dimensions value, same issue. Object which contains width is undefined for some reason

Rodrigo77777 commented 5 years ago

@vitalets temporarily replaced EStyleSheet for react native's Stylesheet, and the app ran correctly. Not sure if the information helps, but thought it might

vitalets commented 5 years ago

Just tested with fresh install of RN 0.59.10 and default generated app - everything works for me Changed StyleSheet -> EStyleSheet in App.js:

import EStyleSheet from 'react-native-extended-stylesheet';
...

EStyleSheet.build();
const styles = EStyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
...

Env:

react-native --version
react-native-cli: 2.0.1
react-native: 0.59.10

Could you provide more details?

Rodrigo77777 commented 5 years ago

Hey @vitalets turns out my specific issue was bubbling up from a new issue with babel completely unrelated to EStyleSheet. I'll leave it to @jibraniqbal666 to provide further details on the issue he is experiencing.

stale[bot] commented 5 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.