在windows搭建react

1.安装必须的软件

1.Python 2 

  注意勾选 Add python.exe to Path,选项,这样就可以在安装完成后,不用手动去添加环境变量

安装完,打开cmd.exe,输入python,然后enter,如果能成功返回ptython的版本号等信息,则说明安装成功。

 

2.Node.js

安装完node之后,打开cmd.exe,输入node -v,如果返回node.jsben,则说明node.js,安装成功。

由于npm在国内的速度奇慢,建议使用淘宝代理,或者使用其他科学上网工具

使用淘宝代理的方法:

npm config set registry https://registry.npm.taobao.org --global

    npm config set disturl https://npm.taobao.org/dist --global


3.安装react-native命令行工具(react-native-cli)

npm install -g yarn react-native-cli

安装成功之后,打开cmd.exe,输入

react-native -v

,然后enter,如果能成功返回react-native的版本号,则说明安装成功。

 

4.安装Android Studio

a.安装jdk

需要jdk1.8以上版本,具体安装教程:http://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html

安装完成之后,打开cmd.exe,输入

 java -version

如果成功返回版本信息,则说明安装成功。

b.安装android studio

1.需要android studio 2.0以上版本,确认勾选安装 android SDK和Android Device Emulator

2.安装完成后,选择Custom安装项

3.下一步一定要勾选HAXM加速驱动和模拟器

4.安装完成之后没在Android Studio的欢迎界面选择 Configure | SDK Manager

  • SDK Platforms窗口中,选择Show Package Details,然后在Android 6.0 (Marshmallow)中勾选Google APIsAndroid SDK Platform 23Intel x86 Atom System ImageIntel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image

  • SDK Tools窗口中,选择Show Package Details,然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1。(必须是这个版本)

然后点击apply和ok,等待安装完成。

5.ANDROID_HOME 环境变量配置

新建系统环境变量,填写android  sdk的安装目录

6.将android SDK的Tools目录添加到系统环境变量中去

需要添加android SDK目录下的tools和platform-tools两个路径

5.安装Genymotion

1.下载和安装Genymotion(需要先注册才能看到download的选项,genymotion需要依赖VirtualBox虚拟机,下载选项中提供了包含虚拟机和不包含的选项,请按需下载)。

2.打开Genmotion,点击ADD,新增一个android的设备,请务必选择5.0以上版本的android系统,不然出现各种奇怪的问题。

3.选中新增加的设备,点击Start按钮,等待片刻即可打开android虚拟机

4.打开cmd.exe,输入

 adb devices

如果返回类似下图所示,则表明虚拟机启动成功。

6.初始化react-native 项目

硬盘上新建文件夹,然后打开cmd.exe,切换到该目录,然后执行

react-native init myProject

这个过程可能会耗费一段时间,请耐心等待,初始化完成之后,切换到新建的myProject文件夹,执行

react-native run-android

等待编译完成,直到在android的虚拟机上出现 WelCome to react-native,则大功告成,修改index.android.js,保存之后,在鼠标移动到虚拟机上,然后点击两次键盘R,就会触发新代码更新到虚拟机。

2.问题总结

1.很多安装过程耗费时间,等耐心等待,没有安装完不要关掉,不要着急

2.建议第一次启动项目的时候,使用5.0以上版本的android虚拟机,不要使用国产的android机,能被坑死的节奏!

3.如果国产手机安装不上,可以使用adb install android/app/build/outputs/apk/app-debug.apk命令来安装

时间: 2024-12-31 09:02:11

在windows搭建react的相关文章

windows搭建react natiive android环境及真机运行遇到的坑

第1步:安装最新版Java 下载安装JDK ,最好是Java Development Kit [JDK] 1.8或更高版本 官网地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 配置环境 (不会的百度哦) 第2步:安装Android SDK 有两种方案,直接安卓android SDK或者Android Studio.Android Studio包含了运行和测试React N

react native windows 搭建(完整版)

声明:用windows 搭建的react native只能开发安卓应用 1.准备安装java jdk,以及Android SDK 传送门: java   JDK   Android SDK(自行寻找) a.设置java的系统环境变量:java_home(指向jdk目录)   path(指向jdk bin目录) classpath: .;%java_home%\lib\dt.jar;%java_home%\lib\tools.jar 这些系统变量名不区分大小写 b.设置ANDROID_HOME用户

手把手教你在Windows下搭建React Native Android开发环境

最近看到React Native好像好厉害的样子,好奇心驱使之下体验了一下并将在Window下搭建React Natvie Android环境的步骤记录下来,并有需要的朋友参考.(我都是参考官方文档的) react-native的GitHub地址:https://github.com/facebook/react-native react-native的文档地址:http://facebook.github.io/react-native/docs/getting-started.html 1.

使用create-react-app搭建react应用

想要像Bootstrap直接引用就可以使用去使用React.js基本上是不可能的.使用React需要一堆的工具和库,需要Babel用于编译,Redux等第三方状态管理工具来组织代码.所以这里根据官方推荐的工具create-react-app工具来搭建react应用.使用这个工具能够实现"一条龙服务",帮我们做好了各种配置和依赖,做到了"开箱即用". 工具地址:https://github.com/facebookincubator/create-react-app

React Native开发 - 搭建React Native开发环境

移动开发以前一般都是原生的语言来开发,Android开发是用Java语言,IOS的开发是Object-C或者Swift.那么对于开发一个App,至少需要两套代码.两个团队.对于公司来说,成本还是有的.然而现在有蛮多的公司开发App是基于React Native来开发的,这样可以做到一个App,就是一套代码,一个团队.对于公司来说,无疑节约了成本. <React Native开发>这系列的文章主要是记录本人利用React Native学习开发的笔记,这一篇文章是第一篇<搭建React Na

[转载]Sublime Text 3 搭建 React.js 开发环境

[转载]Sublime Text 3 搭建 React.js 开发环境 Sublime有很强的自定义功能,插件库很庞大,针对新语言插件更新很快,配合使用可以快速搭建适配语言的开发环境. 1. babel-sublime 支持ES6, React.js, jsx代码高亮,对 JavaScript, jQuery 也有很好的扩展.关于 babel 的更多介绍可以看这里:为什么说Babel将推动JavaScript的发展 安装 PC:Ctrl+shift+p Mac:Cmd+shift+p 打开面板输

Windows搭建Eclipse+JDK+SDK的Android --安卓开发入门级

?? 一 相关下载 (1) java JDK下载: 进入该网页: http://java.sun.com/javase/downloads/index.jsp (或者直接点击下载)如下图: 选择 Download JDK 只下载JDK,无需下载jre. (2)eclipse下载 进入该网页: http://www.eclipse.org/downloads/ (或者直接点击下载:BT下载    HTTP下载) 如下图: 我们选择第一个(即eclipse IDE for java EE Devel

Windows搭建python开发环境,python入门到精通[一]

从大学开始玩python到现在参加工作,已经有5年了,现在的公司是一家.net的公司用到python的比较少,最近公司有新项目需要用到python,领导希望我来跟其他同事training,就有了这篇博客,打算将python的training弄成一个简易的python系列,供大家入门使用.Python语言自从20世纪90年代初诞生至今,它逐渐被广泛应用于处理系统管理任务和Web编程.今天就让我们来搭建一个python的开发环境,Windows搭建python开发环境.一切从"Hello world

Windows搭建wordpress环境

Windows搭建wordpress环境,以金山云大米 Wordpress环境的搭建所需要的条件:MYSQL.PHP.Wordpress. 需要准备的工具: xmapp(可在毒霸或其他软件中心找到) Wordpress(需要自行去官网下载,这里下载的是wordpress_4.2_beta2) 安全组需要添加的入站端口: TCP 21 http 80 通过控制台连接到服务器 安装与配置xampp 1.安装xampp 通过本地电脑软件中心(或其他途径)下载xmapp.wordpress,不要进行安装