Fala Luiz, tudo bem ?
No último release (0.49) o projeto do React Native trouxe uma mudança no template de projeto criado. Agora quando criamos nosso projeto através de react-native init Projeto
não temos mais os arquivos index.ios.js e index.android.js, mas no lugar deles um único entry point no arquivo index.js.
Veja o trecho das Release Notes publicadas no github do projeto:
- New projects have a single entry-point (index.js) from now on (6e99e31) - @fson
Summary:
Before
When creating a new project with react-native init, generated template has two entry-points: index.ios.js and index.android.js
Those two files were always identical
After
When creating a new project, generated template has a single, shared entry-point: index.js
Updating your code
When upgrading to this release with react-native-git-upgrade or react-native upgrade, be aware that these tools will automatically update your code to use index.js instead of index.ios.js and index.android.js, as previously. However, they will not create an index.js file for you. This is a side-effect of the react-native-git-upgrade that has to be reverted. After running that tool, you have two options:
rename index.ios.js to index.js and remove index.android.js (providing that they were as generated by react-native init)
revert changes done by react-native-git-upgrade in order to keep separate entry files. That is, as soon as you upgrade, revert changes made to AppDelegate.m, MainApplication.java and build.gradle.
Você pode ver tudo que a versão traz de novo acessando esse link.
Fique tranquilo quanto ao que aprendemos no curso, todos os conceitos base que apresentamos continuam funcionando da mesma maneira. Apenas temos uma mudança no arquivo que vamos utilizar como entrada.
Se analisarmos o código dos novos arquivos veremos uma estrutura semelhante a que fizemos nos arquivos de entrada do InstaluraMobile
index.js (NEW - único entry point):
import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('Projeto', () => App);
Aqui temos um único ponto de entrada apontando para um outro arquivo que define um componente principal para a app. Se você recordar verá que fizemos exatamente isso no projeto, só que o código era repetido nos dois index das plataformas.
App.js (define o componente principal da app):
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View
} from 'react-native';
const instructions = Platform.select({
ios: 'Press Cmd+R to reload,\n' +
'Cmd+D or shake for dev menu',
android: 'Double tap R on your keyboard to reload,\n' +
'Shake or press menu button for dev menu',
});
export default class App extends Component<{}> {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started, edit App.js
</Text>
<Text style={styles.instructions}>
{instructions}
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
Aqui o mesmo código base de antes, instruindo sobre como modificar o código ao iniciar o desenvolvimento da app.
Espero ter ajudado. Qualquer dúvida poste aqui pra gente. =)
Abraço!