脚本宝典收集整理的这篇文章主要介绍了

react-native之android环境搭建

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

react-native之android环境搭建

本文基于OSX Yosemite 10.10.4

所需软件环境

  • Homebrew

  • Node

  • react-native-cli

  • java

  • Android Studio

  • Watchman

  • Flow

参考react native 中文搭建环境文档

注意事项

  1. 在安装Android Studio的过程中选择custom方式安装,此时可以安装android sdk,严格按照react native 中文搭建环境文档Android Studio部分所需的SDK Platforms和SDK Tools来安装,注意Android SDK Build-Tools 一定是23.0.1版本的。

创建react-native项目

$ react-native init hellowReact

以上命令很多情况下很久都没有响应,可以把npm源替换成国内npm镜像,比如说taobaonpm镜像等,改变npm源有多种方式:

# 方式一: 在~/.npmrc文件的末尾加上下面两句
registry=https://registry.npm.taobao.org/
disturl=https://npm.taobao.org/dist
# 方式二: 命令
$ npm config set registry https://registry.npm.taobao.org
$ npm config set disturl https://npm.taobao.org/dist

此时,在当前目录下生成了一个新的项目名为helloReact,项目目录结构如下所示:

目录结构

目录结构

  • android android应用

  • ios ios应用

  • index.android.js android的js入口

  • index.ios.js ios的js入口

  • package.json 项目的配置

  • node_modules 项目依赖的npm包

android开发

使用安装好的android studio 软件导入上一步创建好项目helloReact的android目录

导入项目

导入项目

导入项目

新建avd(其实就是一个android模拟器)

工具栏-> AVD Manager->
新建AVD

新建AVD

新建AVD

新建AVD

新建AVD

运行AVD

图片描述

运行导入的工程文件

Gradle编译好过后就可以运行了

工具栏

在模拟器上安装app并且运行

运行结果

ios开发

使用xcode打开新建项目helloReact的ios目录下的hellowReact.xcodeproj文件,点击运行即可在模拟器中查看结果

总结

以上是脚本宝典为你收集整理的

react-native之android环境搭建

全部内容,希望文章能够帮你解决

react-native之android环境搭建

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过