因为涉及到的项目需要开发个手持设备的几个功能，目前花了一周配置好这两个环境，安卓真机器无法被识别到哈哈， 是用ws+as的虚拟机在开发，期间遇到很多不可思议的 颠覆性的问题？操作？‘ 大佬不用看了。。。。。。。 React Native配置Po在这里 然后就是安装as，这里不建议使用as，很多前端都不提示，而且很多时候回给你错误的推荐，一点项目就完蛋！！！ 推荐ws进行开发！！！！ 没有as的可以去https://reactnative.cn/docs/getting-started/这里看怎么安装配置环境变量 安装好了，现在先int项目 react-native init MyApp （项目名字） 你可以使用–version参数（注意是两个杠）创建指定版本的项目。例如react-native init MyApp --version 0.44.3。注意版本号必须精确到两个小数点。我的版本是0.60.0 推荐安卓真机，启动命令：cd AwesomeProject react-native run-android
如果接下来程序运行无误，显示了React图片跟其他的英文，就是天胡开局（我自己整了好几天！！各种问题！！） 接续配置react-navigation（这是react-native搭配的跳转以及抽屉等）
1、先安装在React Native 项目中安装react-navigation这个包 yarn add react-navigation
2、然后，安装 react-native-gesture-handler。 如果你用Expo managed workflow,那可以省略这一步 yarn add react-native-gesture-handler
3、坑来了哈，让你react-native版本>=0.60 不用link包，但是你大于0.60版本的不link库还是白瞎 react-native link 直接输入这个命令，是依赖所有库，如果你接下来使用Ant Design Mobile RN的话，安装完毕 yarn add @ant-design/react-nati 会让你链接字体 图标 还是需要这个命令 不过一般安完React Native 你就会出现各种各样的错误，哪怕上传到git 重新拉下来项目 也会出错 我下载了好几个demo都没成功过。。。
反正我能运行成功是init了无数项目。。 期间遇到了–no-jetifier错误，是上一次init的项目能使用，下一次init的就出现这个错误，要把这个东西加在启动命令之后才可运行。 我反正用了一周，我想看看 有没有比我更长的。。。。。。。。。。 如果配置好了这两个RN 实例送给你
import React from "react"; import { createStackNavigator, createAppContainer } from "react-navigation"; import { StyleSheet,View, Text,Button,Image,TouchableHighlight} from 'react-native'; import Storage from "./Storage"; import Outbound from "./Outbound"; import Maintain from "./Maintain"; import ReportedStopping from "./ReportedStopping"; class HomeScreen extends React.Component { render() { return ( <View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}> <Text >HomeScreen</Text> <Button title="去下一页" onPress={() => this.props.navigation.navigate('Details')} /> <Button title="点击刷新" onPress={() => this.props.navigation.push('Home')} /> </View> ); } } }); /*下面几行代码才是实现连接跳转的关键，只需要注册即可实现跳转*/ const AppNavigator = createStackNavigator({ Home: HomeScreen, Details: DetailsScreen, },{ initialRouteName: "Home" }); const AppContainer = createAppContainer(AppNavigator); export default AppContainer; /* 可以写在一起，也可分开写*/ class DetailsScreen extends React.Component { render() { return ( <View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}> <Text >Details Screen</Text> <Button title="去主页" onPress={() => this.props.navigation.navigate('Home')} /> <Button title="点击刷新" onPress={() => this.props.navigation.push('Details')} /> </View> ); } }Po上我的packge.json
{ "name": "reactApp", "version": "0.0.1", "private": true, "scripts": { "start": "react-native start", "test": "jest", "lint": "eslint ." }, "dependencies": { "@ant-design/react-native": "^3.1.10", "react": "16.8.6", "react-native": "0.60.0", "react-native-gesture-handler": "^1.3.0", "react-navigation": "^3.11.1" }, "devDependencies": { "@babel/core": "^7.5.5", "@babel/runtime": "^7.5.5", "@react-native-community/eslint-config": "^0.0.5", "babel-jest": "^24.8.0", "eslint": "^6.0.1", "jest": "^24.8.0", "metro-react-native-babel-preset": "^0.55.0", "react-test-renderer": "16.8.6" }, "jest": { "preset": "react-native" } }谢谢大家的观看，有问题请留言。或者加我wx16653144918
