React Native在windows环境下的搭建

  • Z时代
  • 2024-01-10
  • 分类：综合

react

React Native 是Facebook开源的一个框架，这套框架基于js编写App，实现两大平台的70%左右代码复用，从而实现Learn Once ，write anywhere 。网上windows环境下搭建RN真的一坑更比一坑深，没办法谁让穷逼买不起macbook呢。

环境配置

1、JDK安装,设置JAVA_HOME与path（有过Java基础的都会）。

2、Android SDK的安装：设置环境变量ANDROID_HOME：Android SDK Manager的位置 例如：（ANDROID_HOME=> E:\Android\sdk）设置环境变量PATH：例如：（PATH=> %ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools

3、SDK的设置

因为之前电脑是用来搞Android开发的，因为各个版本的SDK都已经安装好了，对于之前不是做Android的同学，需要打开Android SDK Manager。 选中以下项目： 
Android SDK Build-tools version 23.0.1 
Android 6.0 (API 23) 
Android Support Repository 

Local Maven repository for Support Libraries

4、安装node.js

https://nodejs.org/en/

下载下来点击下一步就ok了。


博主为win7 64系统

DOS窗口通过node -v的命令来测试NodeJS是否安装成功。

5、安装git

6、安装react-native命令行工具react-native-cli

7、创建一个React Native项目

react-native init AwesomeProject   cd进入希望创建项目的盘符，用此命令行创建名为AwesomeProject（名称更更改）。

8、运行package

在命令行中进入项目目录，输入react-native start，这时候可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android，如果可以访问表示服务器端已经可以了。此处红字标记的android部分，在后来版本中，index.android.js文件与index.ios.js文件合并成为App文件，浏览器访问时应该把android字样去掉，这样才能访问成功，博主在这个坑徘徊了整整一个下午啊！！！

9、运行项目

可导入android studio运行或者命令行输入react-native run-android 但是构建时间可能会有些长，最好全程保持翻墙状态，输入命令行之前连接真机或模拟器。如果出现红屏报错，记得摇一摇手机，然后点击Dev Settings，点击Debug server host & port for device,设置IP和端口

dos命令输入ipconfig查看ipv4地址，端口写8081.

10、接下来就是见证奇迹的时刻了

windows系统的环境搭建跟网上大部分的教程大同小异，教程不详细的部分日后博主会在做详细更新，谢谢。


以上是 React Native在windows环境下的搭建 的全部内容， 来源链接： utcz.com/z/384275.html

回到顶部