Taro 中的 Android 开发环境搭建

library
category
tags
React
Taro
Android
ReactNative
attribute
笔记
source
date
Aug 1, 2020
slug
a-summary-of-the-android-dev-env-in-taro
status
Published
summary
0.安装前保证以下环境已配置完毕JDK1.8安装 Android Studio并配置 Android环境、虚拟机 参考 Android Studio篇2.编译RN获取最新 master项目代码。 刪除项目中node_ modules文件夹

0.安装前保证以下环境已配置完毕

1.安装Android Studio并配置Android环境、虚拟机

2.编译RN

  • 获取最新master项目代码。
  • 删除项目中node_modules文件夹。
  • 从微盘获取最新node_modules压缩包,并解压放入项目目录中 。
💡
使用他人的node_modules包(尤其是不同系统平台的),在使用npm命令前可能需要重置node-sass包:npm rebuild node-sass
  • 在项目根目录中打开cmd窗口,输入命令:npm run dev:rn后开始编译RN(编译后的RN代码位于rn_temp目录中)。
💡
如提示node_sass包错误,则需要先修复node_sass包:npm rebuild node-sass

3.编译Debug版APP

  • 确保RN编译成功。
  • 确保Android Studio模拟器已开启。
  • 确保react-native-debugger.exe已开启(微盘获取)。
  • 在项目根目录下运行命令:react-native run-android开始打包并向模拟器安装Debug版APP(如果提示找不到命令,则使用:npx react-native run-android,再者就是node_modules包有问题)。
💡
如提示INSTALL FAILD或者模拟器名称,则表示未能成功安装到模拟器上,检查模拟器是否已装有APP,卸载即可。如提示Could not get resource https://dl.google.com/dl/android/ 等网址,则表示当前网络无法下载该网址的资源,要更换代理节点。如提示未找到react-native-xxx等插件,则表示当前node_modules包中缺少该插件。
  • Debug版APP安装成功后,打开APP,按下Ctrl+M呼出控制菜单,开启Debug JS Remotely选项,此时另一个node命令窗口会开始走进度条,进度条走完后APP将会连接上调试,react-native-debugger.exe中会输出APP的调试信息,此时完成Debug版的APP安装(RN编译窗口还在的话,就可以进行修改代码等操作,保存后会自动监听编译,退出APP再开启最新的修改就会生效)(切换测试站的话修改rn_temp/config_host.js文件,修改完重启APP)。
💡
对于开发来说,RN编译命令窗口、node命令窗口、react-native-debugger.exe开启、APP开启Debug JS Remotely选项,这四个前提条件都做好,代码修改才会生效。

4.编译Release版APP

  • 如果上一步react-native run-android命令运行成功,那之后运行不需要再开启代理(如果有新插件的添加才需要开启)。
  • 运行react-native run-android --variant=release开始打包Release版APK(同编译Debug流程,如提示找不到命令,尝试在前面加上npx)。
  • 命令运行完后会默认将打包出来的APK文件安装进模拟器中,如果此时模拟器里有安装Debug版的APP,则会提示安装错误,如果实在想安装到模拟器里,可以先卸载Debug版的APP后再进行安装
  • 如果只需要拿到APK文件的话,可以忽略安装错误,直接去project/android/app/build/outputs/apk/release/目录里拿就好了。
💡
关于打包的Release版APP,本地图标不显示问题,请查看Taro-RN开发总结。

Nobelium is built with ♥ and ⚛ Next.js. Proudly deployed on ▲Vercel.

© Ashinch 2021 桂ICP备18011166号-1