React Native官方开发文档

以下是本人抄录的:

初次接触React Native感觉和React很像,却是有点类似,但不完全是,React Native有自己的组件对象,不过它也自定义的组件也是使用ES6中的语法定义。

首先是安装的依赖,必须安装:Node、React Native命令行工具、Python2 以及JDK和Android Studio。

开发的编辑可以根据自己喜好来,本人使用的时WebStorm,和Android Studio有点像。

1、Node、React Native命令行工具是开发是需要管理包用到。
2、Python2 安装暂时不知道干什么用,但开发文档中提到,那就安装吧。
3、Android Studio是在编译Android应用所需的工具和环境。

Node, Python2, JDK

建议直接使用搜索引擎搜索下载 Node 、Python2 和Java SE Development Kit (JDK)

注意 Node 的版本必须高于 8.3,Python 的版本必须为 2.x(不支持 3.x),而 JDK 的版本必须是 1.8(目前不支持 1.9 及更高版本)。安装完 Node 后建议设置 npm 镜像以加速后面的过程(或使用科学上网工具)。

注意:不要使用 cnpm!cnpm 安装的模块路径比较奇怪,packager 不能正常识别!

//设置 npm 镜像以加速后面的过程(或使用科学上网工具)
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

Yarn、React Native 的命令行工具(react-native-cli)

Yarn是 Facebook 提供的替代 npm 的工具,可以加速 node 模块的下载。React Native 的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。

npm install -g yarn react-native-cli
//安装完 yarn 后同理也要设置镜像源:
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

安装完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方库名代替npm install 某第三方库名

JDK环境变量配置

1、新建->变量名”JAVA_HOME”,变量值”C:\Program Files\Java\jdk1.8.0_151”(即JDK的安装路径)
2、编辑->变量名”Path”,在原变量值的最后面加上“;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin”
3、新建->变量名“CLASSPATH”,变量值“.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar”

       

配置这三个有什么作用呢?
JAVA_HOME:
为了方便引用,比如,你JDK安装在C:\Program Files\Java\jdk1.6.0目录里,则设置JAVA_HOME为该目录路径, 那么以后你要使用这个路径的时候, 只需输入%JAVA_HOME%即可, 避免每次引用都输入很长的路径串;
2)归一原则, 当你JDK路径被迫改变的时候, 你仅需更改JAVA_HOME的变量值即可, 否则,你就要更改任何用绝对路径引用JDK目录的文档, 要是万一你没有改全, 某个程序找不到JDK, 后果是可想而知的—-系统崩溃!
3)第三方软件会引用约定好的JAVA_HOME变量, 不然, 你将不能正常使用该软件, 以后用JAVA久了就会知道, 要是某个软件不能正常使用, 不妨想想是不是这个问题。 CLASSPATH: (要加.;表示当前路径)
作用:这是一个很有趣,当然也比较折磨初学者的问题, 这个变量设置的目的是为了程序能找到相应的”.class”文件, 不妨举个例子: 你编译一个JAVA程序—A.java, 会得到一个A.class的类文件,你在当前目录下执行java A,
将会得到相应的结果(前提是你已经设置CLASSPATH为”.”). 现在, 你把A.class移到别的目录下(例如:”e:\”), 执行java A, 将会有NoClassDefFindError的异常,原因就是找不到.class文件,
现在你把CLASSPATH增加为:”.;e:\”再运行java A, 看看会有什么结果),一切正常, java命令通过CLASSPATH找到了.class文件! Path:
道理很简单, 你想在任何时候都使用%JAVA_HOME%\bin\java 等来执行java命令吗, 当然不会, 于是, 你可以选择把 %JAVA_HOME%\bin添加到PATH路径下, 这样, 我们在任何路径下就可以仅用java来执行命令了.
(当你在命令提示符窗口输入你个代码时,操作系统会在当前目录和PATH变量目录里查找相应的应用程序, 并且执行.)

检验是否配置成功 运行cmd 输入 java -version (java 和 -version 之间有空格) 
若如图所示 显示版本信息 则说明安装和配置成功。

Android 开发环境

安装Android开发环境很麻烦,而且感觉摸不到头脑,不过慢慢摸索会清楚的。

请注意!!!国内用户必须必须必须有稳定的翻墙工具,否则在下载、安装、配置过程中会不断遭遇链接超时或断开,无法进行开发工作。
某些翻墙工具可能只提供浏览器的代理功能,或只针对特定网站代理等等,请自行研究配置或更换其他软件。总之如果报错中出现有网址,
那么 99% 就是无法正常翻墙。

1. 安装 Android Studio

首先下载和安装 Android Studio,如果大不开,请自行搜索下载链接。安装界面中选择"Custom"选项,确保选中了以下几项:

1、Android SDK
2、Android SDK Platform
3、Performance (Intel ® HAXM)
4、Android Virtual Device

然后点击"Next"来安装选中的组件。如果选择框是灰的,你也可以先跳过,稍后再来安装这些组件。

安装完成后,看到欢迎界面时,就可以进行下面的操作了。

2. 安装 Android SDK

Android Studio 默认会安装最新版本的 Android SDK。目前编译 React Native 应用需要的是Android 8.1 (Oreo)版本的 SDK。你可以在 Android Studio 的 SDK Manager 中选择安装各版本的 SDK。

你可以在 Android Studio 的欢迎界面中找到 SDK Manager。点击"Configure",然后就能看到"SDK Manager"。

或者使用Ctrl+Alt+S,或者在工具栏中打开SDK Manager设置界面

可以根据需要来,安装对应版本的SDK

在 SDK Manager 中选择"SDK Platforms"选项卡,然后在右下角勾选"Show Package Details"。展开Android 8.1 (Oreo)选项,确保勾选了下面这些组件(重申你必须使用稳定的翻墙工具,否则可能都看不到这个界面):

  • Android SDK Platform 27
  • Intel x86 Atom_64 System Image(官方模拟器镜像文件,使用非官方模拟器不需要安装此组件)

然后点击"SDK Tools"选项卡,同样勾中右下角的"Show Package Details"。展开"Android SDK Build-Tools"选项,确保选中了 React Native 所必须的27.0.3版本。你可以同时安装多个其他版本。

上面安装SDK的过程可能很慢,我弄了一个下午才弄好。

3. 配置 ANDROID_HOME 环境变量

React Native 需要通过环境变量来了解你的 Android SDK 装在什么路径,从而正常进行编译。

打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 新建,创建一个名为ANDROID_HOME的环境变量(系统或用户变量均可),

指向你的 Android SDK 所在的目录(具体的路径可能和下图不一致,请自行确认):

SDK 默认是安装在下面的目录: c:\Users\你的用户名\AppData\Local\Android\Sdk

你可以在 Android Studio 的"Preferences"菜单中查看 SDK 的真实路径,具体是Appearance & Behavior → System Settings → Android SDK。

你需要关闭现有的命令符提示窗口然后重新打开,这样新的环境变量才能生效。

React Native在window下的环境搭建(一)的更多相关文章

  1. React Native在window下的环境搭建(二):创建新项目

    React Native创建一个新项目: react-native init TestAndroidApp 提示:你可以使用--version参数(注意是两个杠)创建指定版本的项目.例如react-n ...

  2. 【转】android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创)

    原文网址:http://www.cnblogs.com/zdz8207/archive/2012/11/27/android-ndk-install.html android 最新 NDK r8 在w ...

  3. android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创)

      android 最新 NDK r8 在window下开发环境搭建 安装配置与使用 详细图文讲解,完整实际配置过程记录(原创) 一直想搞NDK开发却一直给其他事情耽搁了,参考了些网上的资料今天终于把 ...

  4. Android NDK r8 Cygwin CDT 在window下开发环境搭建 安装配置与使用 具体图文解说

    版权声明:本博客全部文章均为原创.欢迎交流.欢迎转载:转载请勿篡改内容,而且注明出处,谢谢! https://blog.csdn.net/waldmer/article/details/3272500 ...

  5. react native window下的环境搭建和调试方案

    这几天使用react native开发app,遇到一些坑,先记录下来,以后再继续补充 环境搭建 打开react native中文网,发现环境搭建特么也太复杂了,安装各种插件/软件,对于我们 编辑器+浏 ...

  6. React Native入门教程 1 -- 开发环境搭建

    有人问我为啥很久不更新博客..我只能说在学校宿舍真的没有学习的环境..基本上在宿舍里面很颓废..不过要毕业找工作了,我要渐渐把这个心态调整过来,就从react-native第一篇博客开始.话说RN也出 ...

  7. React Native - 1 Windows下的环境配置(Windows+Android)

    参考:https://facebook.github.io/react-native/docs/getting-started.html(要FQ)     网站上建议使用Chocolatey去配环境, ...

  8. Windows下React Native开发01 -- Android开发环境搭建

    1.安装jdk 推荐将JDK的bin目录加入系统PATH环境变量(自己百度下怎么配置). 2.安装SDK 直接安装 Android Studio  推荐从AndroidDevTools下载.(也可以直 ...

  9. window下lamp环境搭建

    软件: apache_2.2.25.msi php-5.4.30-Win32-VC9-x86.zip mysql-5.6.11-win32.msi下载地址:http://download.csdn.n ...

随机推荐

  1. Fiddler中session请求/响应类型与图标含义

    近期在看fiddler抓包工具,发现前面都会有小图标显示,不同的图标代表了不同的含义,通过查询,整理如下:  请求发送到服务器  从服务器下载响应结果  请求在断点处被暂停  响应在断点处被暂停  请 ...

  2. 19/03/15Pyhon笔记

    1.快速在python中显示目标的2进制写法 bin(342) "0b101010110" 2.一个二进制位就是一比特(bit) 3.Python2默认无法识别中文,需要加文件头 ...

  3. MySQL数据库-pymysql模块操作数据库

    pymysql模块是python操作数据库的一个模块 connect()创建数据库链接,参数是连接数据库需要的连接参数使用方式: 模块名称.connect() 参数: host=数据库ip port= ...

  4. 登录ssh提示:ssh_exchange_identification: read: Connection reset by peer error

    vim /etc/hosts.allow 添加 sshd : ALL

  5. CSS 社区的解决方案,对比

    在众多解决方案中,没有绝对的优劣.还是要结合自己的场景来决定. 我们团队在使用过 scss 和 css modules 后,仍然又重新选择了使用 scss.css modules 虽然有效解决了样式冲 ...

  6. 十七、springcloud(三)服务的注册与调用

    1.启动服务注册中心Eureka(见上篇) 启动成功后,暂时无服务 2.项目框架 3.创建服务提供者(spring-cloud-houge-provider)jar a.application.pro ...

  7. 游戏数据分析中“次日留存率”与“游戏生命周期第N天上线率”的SAS实现

    在游戏行业,次日留存率是个很重要的指标,对于评价一款游戏的优劣具有很重要的参考价值. 下面先看以下相关的定义: 用户留存:统计时间区间内,新登用户在随后不同时期的登录使用情况. 日次留存率:日新登用户 ...

  8. [ZZ] 麻省理工( MIT)大神解说数学体系

    麻省理工( MIT)大神解说数学体系 http://blog.sina.com.cn/s/blog_5ff4fb7b0102e3p6.html 其实每一门学科都应该在学习完成后,在脑子里面有一个体系, ...

  9. JavaBean是什么,POJO是什么

    参考:https://stackoverflow.com/questions/3295496/what-is-a-javabean-exactly https://stackoverflow.com/ ...

  10. Delphi2009之TImage

    TPngImage原来是SourceFroge上的一个开源项目,现在突然消失了,为什么呢?Nick 在他的博客上写到:TPNGImage被CodeGear/Embarcadero收购了,现在直接就是D ...