ReactNative

ReactNative+Webstorm开发环境搭建(基于And

2018-07-01  本文已影响0人  Windows_XP

前言:
WebStorm的开发环境搭建可以参考https://blog.csdn.net/calvin_zhou/article/details/79427566
本文目的主要记录本地创建一个ReactNative工程并运行出来一个HelloWord程序

1.nodejs官方网站下载并安装https://nodejs.org/zh-cn/

1.png

2.配置nodejs环境变量


2.png 3.png

测试是否安装完成

打开cmd
输入:node -v
4.png

3.配置npm源
由于国外的npm服务器下载太慢了,因此配置国内的服务器如下:

在图4的cmd窗口中
输入:npm config set registry https://registry.npm.taobao.org --global
输入:npm config set disturl https://npm.taobao.org/dist --global
5.png

配置完成

4.安装react native环境

在图5的cmd窗口中
输入:npm install -g react-native-cli
6.png

5.新建ReactNative工程

在图6的cmd窗口中
切换到我需要新建工程的目录中,这里根据自己情况选择创建工程位置
输入:e:
输入:cd E:\ReactNativeWork
新建一个react-native工程,工程名为Demo
输入:react-native init Demo
7.png 8.png 9.png

6.把创建的工程中的android这个目录作为工程在AndroidStudio中打开,并把 HelloWord 跑起来
这里就不多说了,根据自己的AndroidStudio开发环境进行调试,最终只要跑起来就行了


10.png

7.开启本地服务器

在WebStorm中输入:npm start
11.png

然后再在AndroidStudio中发布一次就行了

12.png

成功跑起!
ps:我这里用的不是最初创建的Demo工程,是我自己的一个工程
我也是才接触ReaceNative,有些理解不到位的地方欢迎指正,
遇到问题可留言,在我能解决的范围内一定回复

上一篇 下一篇

猜你喜欢

热点阅读