So I have been creating a new React-Native app using the following commands
npm install -g expo-cli
expo init confusion
cd confusion
yarn start
Then I type yarn start
and get this in terminal
To run the app with live reloading, choose one of:
• Scan the QR code above with the Expo app (Android) or the Camera app (iOS).
• Press a for Android emulator, or i for iOS simulator.
• Press e to send a link to your phone with email.
• Press s to sign in and enable more options.
Expo Press ? to show a list of all available commands.
Logs for your project will appear below. Press Ctrl+C to exit.
I press option a and this is what I see in the android emulator.
The App.js using a functional component.
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default function App() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
The generated package.json from the react-native app is this
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"expo": "^35.0.0",
"react": "16.8.3",
"react-dom": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
"react-native-web": "^0.11.7"
},
"devDependencies": {
"babel-preset-expo": "^7.1.0"
},
"private": true
}
The Android SDK version is 27 or Oreo 8.1
What is wrong and how to fix that annoying bug?
Thanks,
Theo.