React Native项目,index.ios.js或index.android.js未生成

时间:2017-10-05 17:35:48

标签: reactjs react-native

我今天开始使用React-Native。我正在关注网络教程。

我的Windows机器上是否正确安装了所有设备:

  • Java Jdk
  • Android Studio
  • Node / NPM
  • 纱线

然后安装react-native

npm install -g react-native-cli

最后是一个问候世界项目

react-native init albums

我没有收到任何错误。我的应用程序完全在我的Android手机上运行(基本上已加载)。

app.js有点选择平台:

 /**
 * 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,
  },
});

我只想知道生成这些文件是否正常。 我要创建这两个索引文件吗?或者最新的react-native不需要2个单独的文件? (我关注的教程是2017年1月)

The Project structure

2 个答案:

答案 0 :(得分:40)

这是为react-native添加的新功能。新项目模板现在不包含两个单独的文件。如果您愿意,您仍然可以像以前一样创建和使用,但是按照原样使用它是正常的。它只是一个偏好和您的项目的要求。您可以在here上找到有关更改的更多信息。

来自提交说明

  

这一变化(最初讨论于   react-community/create-react-native-app#26)移动HelloWorld   项目模板来自两个几乎相同的入口点   (index.android.jsindex.ios.js)到一个单一的,最小的   index.js入口点。根组件在App.js中创建。   这统一了react-native initApp.js之间的项目结构   创建React Native App并允许CRNA的弹出使用入口点   来自HelloWorld模板,没有任何黑客来定制它。也   文档中的示例可以以同样的方式复制粘贴到AppRegistry.registerComponent   在HelloWorld和CRNA应用程序中,无需先了解    for (int i = 0; i < grid_caseTypes.Items.Count; i++) { for (int j = 0; j < grid_caseTypes.Columns.Count; j++) { var test = grid_caseTypes.Columns[j].GetCellContent(grid_caseTypes.Items[i] ) as TextBlock; if (test!=null) table.AddCell(test.Text); } }

答案 1 :(得分:0)

仅仅因为新的项目模板现在没有单独包含index.android.js和index.ios.js。它现在只包含一个最小的index.js入口点。

  

如果您想为两个/其中一个平台执行特定操作   然后你可以创建自己的index.android.js和index.ios.js文件   然后只需从index.js文件中导入它们中的代码   在那里做必要的改变。

index.android.js和index.ios.js可以写成:

import Render from './App';

export default Render;