React Native入门系列:如何搭建RN环境(Windows篇)

综合技术 简书

一、为什么我们要学习RN开发?

现实来说,如果你会RN,还会原生开发,工作会更加好找,待遇也会更加高。

可参考: 关于为什么学习React Native三点原因

二、学习RN,我们需要准备什么?

1.个人技能

如果你要通吃移动端的话:你要必须掌握js脚本语言、java,至少了解OC/Swift,同时也应该会Android或IOS原生开发,用于RN对原生控件的封装。

2.工具与环境(以Android的RN开发为例子)

  • Node.js(自带npm)

    Node下载地址: 根据自己电脑配置对应下载note版本

    • 下载安装完成后,运行cmd,输入 node -v 可以查看当前安装的node.js的版本
      输入 npm -v 可以查看当前npm的版本
    • 安装成功后,输入node回车后,便可以输入js语法进行简单的计算了
    • node.js安装完成后,已经说明node.exe已经加入到了path环境变量中
    • 安装完成后建议设置npm镜像以加速后面的过程(或使用科学上网工具),如下命令:

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

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

    • 也可使用 nrm切换NPM镜像加速

      查看node版本.png

  • React Native Command Line Tools
    • 进行本操作的前提是node.js安装成功,安装RN命令行工具直接使用node install命令,如下:
npm install -g react-native-cli

安装RN命令行工具.png

  • Android Studio

    • 配置环境变量(JDK)

      • 下载和安装JDK: JDK官方下载地址
      • 安装完成后配置环境变了,右键偶的电脑——属性——高级系统设置——环境变量

        图片.png

        • 找到path变量——编辑——变量值:JDK安装目录(默认在C:Program FilesJavajdk1.8.0_40bin),如果变量值已有其他值,请用”;”分隔

        图片.png

      • 接下来配置CLASSPATH,

        新建变量:CLASSPATH

        变量值:.;C:Program FilesJavajdk1.8.0_40libtools.jar;C:Program FilesJavajdk1.8.0_40libdt.jar(如果你的jdk不是jdk1.8.0_40版本的,请修改)

        图片.png

        • 接下来配置JAVA_HOME(缺了这一步Android studio会显示找不到jdk安装目录)

          新建变量:JAVA_HOME

          变量值:JDK安装目录

        图片.png

        • jdk安装且环境配置完成,可在cmd中检查是否安装成功,命令:java -version

图片.png

三、如何去学习RN开发?

如果我的文章有帮助到您,请点个赞,您的鼓励是我写作的最大动力。

待更新…..下一篇文章:React Native入门系列:我的第一个RN项目

简书稿源:简书 (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 综合技术 » React Native入门系列:如何搭建RN环境(Windows篇)

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录