ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、视频、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
### 创建App * * * * * #### 创建步骤: ~~~ react-native init MyApp cd MyApp react-native run-ios ~~~ #### 运行方式: 命令行运行` react-native run-ios` Xcode打开 MyApp→ios→MyApp.xcodeproj这个文件,点击左上角的运行按钮。 ![](https://box.kancloud.cn/f0707a94c4562d9b2f0d345a41b18f35_1436x370.png) **注意**:init命令默认会创建最新的版本,而目前最新的0.45及以上版本需要下载boost库编译。此库体积庞大,在国内即便翻墙也很难下载成功,导致很多人无法正常运行iOS项目,中文网在论坛中提供了这些库的国内下载链接。如果你嫌麻烦,又没有对新版本的需求,那么可以暂时创建0.44.3的版本。 ~~~ react-native init MyApp --version 0.44.3 ~~~ 提示:如果run-ios无法正常运行,请使用Xcode运行来查看具体错误(run-ios的报错没有任何具体信息)。 一个新创建的APP的目录结构: ![](https://box.kancloud.cn/64f4a5aec95d43f639f0a55780fc5110_588x752.png) App.js就是这个项目的入口文件(之前的版本会有两个文件index.android.js和index.ios.js,现在2.0.1创建就是只有一个App.js文件了) ~~~ //通过Platform.select来判断不同的环境 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', }); ~~~ ~~~ // 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, }, }); ~~~ ~~~ // index.js 入口文件 import { AppRegistry } from 'react-native'; import App from './App'; AppRegistry.registerComponent('demo', () => App); // 注册App组件成为整个demo应用的根容器 ~~~