程序员

ReactNaticve入门1

记录入门过程。希望对大家有所帮助。
入门网站:
http://wiki.jikexueyuan.com/project/react-native/GettingStarted.html.
官网:
http://facebook.github.io/react-native/docs/getting-started.html.

好吧,官网推荐在window下的话使用Chocolatey。最近比较穷,ios开发机就先算了,用windows学习吧。先装个Chocolatey看看是怎么回事。官网:https://chocolatey.org/ 。感觉就是windows下的apt-get。

  1. Chocolatey 安装
    用管理员的身份运行cmd或是powershell。之后使用一种方式安chocolatey
    cmd方式:输入如下命令:

     @powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin

    powershell方式:输入如下命令:

     iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))

    出现chocolatey is now ready,表示安装成功

    有些机器上会出现 “无法加载文件 ,因为在此系统上禁止运行脚本” 的情况,这是由于系统的执行策略造成的。有兴趣的同学可以到微软官方说明这里了解详细信息。默认情况下是严格模式,允许执行命令但是禁止执行脚本。输入以下命令将执行策略设置为允许签名的远程脚本就行了。

     Set-ExecutionPolicy -ExecutionPolicy RemoteSigned

    家里网络还是比较慢的。还是得上vpn可以下载会快一些。

    Chocolatey的使用

    安装成功之后,就可以使用Chocolatey了。常用功能如下:

    search命令

     choco search 关键字

    会搜索出所有包含关键字的软件包。例如搜索jdk会列出eclipse等好几个软件。

    install命令

     choco install 软件包名称

    安装对应的软件包。

    update命令

     choco upgrade 软件包名称

    uninstall命令

     choco uninstall 软件包名称

    会卸载指定的软件包。

    如果不想在命令行下搜索和安装软件包,可以安装ChocolateyGUI,这是一个图形化的界面,可以方便的执行上述命令。

     choco install chocolateygui

    除了在命令行中搜索软件包,还可以直接在Chocolatey网站上搜索软件包,网址是https://chocolatey.org/packages/ 。细心的同学会发现在网站上有一些同名的软件包,不同之处在于一个后面有Install,另一个则没有。这两者的区别是:有Install的软件包在安装之后,会在控制面板的添加和删除程序中找到。

  2. 安装环境

     choco install nodejs.install
     choco install python2
     npm install -g react-native-cli
  3. 安装Gradle
    下载gradle-2.2.1-all 存在到本地,如存放于M:\workspace\web前端\前端技术
    解压到d:盘programes目录。配置环境变量
    GRADLE_HOME=D:\Program Files\gradle-2.2.1
    PATH中加入%GRADLE_HOME%\bin目录。
    打开cmd 运行

     gradle -v

    测试是否正常

  4. 安装git for windows

    https://git-for-windows.github.io/
    下载并安装。

  5. 安装安卓sdk
    官网下载adt-bundle,解压到d:\Program Files\adt-bundle
    配置环境变量:
    ANDROID_HOME=D:\Program Files\adt-bundle\sdk
    在PATH中加入环境变量:%ANDROID_HOME%\tools 和 %ANDROID_HOME%\platform-tools
    运行:

      android  list target

    正确返回说明成功。

  6. 下载最新的node.js并安装
    https://nodejs.org/en/

      npm  install -g nrm

    安装 nrm方便切换源
    安装完运行

     nrm ls

    查看当前源。
    运行

     nrm taobao

    切换到淘宝源。
    运行

      nrm test npm

    测试源速度。

  7. 创建测试工程

     $ react-native init AwesomeProject
  8. 连上手机。或是使用模拟器。推荐Genymotion模拟器。

  9. 编译运行:

     react-native run-android

    然后等上一会,程序编译完成,手机上看到AwesoneProject的APP。
    待续…