基于ReactNative的项目构建流程
整体环境:1,对于MAC开发机,环境搭建参考资料: https://facebook.github.io/react-native/docs/getting-started.htmlBuilding Projects with Native Code:Development OS:macOSTarget OS:ios和Android注:安装jdk不需要在.bash_profile中...
整体环境:
1,对于MAC开发机,环境搭建参考资料: https://facebook.github.io/react-native/docs/getting-started.html
Building Projects with Native Code:
Development OS:macOS Target OS:ios和Android
react-native的搭建官网有了改动,可以参考:http://reactnative.dev/docs/environment-setup
注:安装jdk不需要在.bash_profile中配置环境变量
2,开发工具VS Code插件:
React Native Tools
Babel ES6/ES7
ESLint
Prettier
Auto Close Tag
Android 环境搭建步骤
1,将工程根目录下的Android文件导入Android Studio,进行编译,生成apk文件安装到真机
2,在项目根目录下执行以下两步:
2.1 adb reverse tcp:8081 tcp:8081:反向代理,流量走usb
2.2 react-native run-android :启动服务
注:在执行react-native run-android命令的时候会报有些react-native依赖包找不到,需要翻墙下载
iOS 环境搭建步骤
模拟器调试:
按照官方教材安装Xcode
安装react-native-cli
执行命令yarn,安装node_modules依赖包
在项目目录下执行react-native run-ios,如在编译过程中报错:/bdcloud_frontend/ios/build/Build/Intermediates.noindex/Branch.build/Debug-iphonesimulator/Branch.build/Script-33DDE884200DF04B0047EB71.sh: line 3: /bdcloud_frontend/ios/scripts/react-native-xcode.sh: Permission denied,则执行chmod a+x /bdcloud_frontend/ios/scripts/react-native-xcode.sh
真机调试:
打开xcode,通过USB连接设备,运行工程,将App加载到真机上
运行项目目录下/ios/MacDebuggerClient/MacDebuggerClient.xcodeproj工程,启动mac机通行server
然后就可以愉快的进行调试啦
真机离线包安装
执行命令react-native bundle --entry-file index.js --bundle-output ./ios/bdcloud/main.jsbundle
打开xcode,通过USB连接设备,运行工程,将App加载到真机上
常见问题
Metro Bundler can’t listen on port 8081
sudo lsof -i:8081
kill 查到的pid号
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
所有评论(0)