设置React Native

作者: 林檎果 | 来源:发表于2018-03-16 22:32 被阅读52次

    适用范围

    大部分情况下均可用React Native一套代码跑两个平台,比如信息展示和交互等等。
    如果涉及到手机设备如摄像头、定位、地图等,则要么封装原生代码给React Native调用,要么直接跳转到用原生代码开发的页面。

    搭建开发环境

    硬件条件:推荐使用Mac电脑开发,可以同时开发iOS和Android两个平台

    必装工具

    安装指南

    1. Homebrew (Mac下的包管理工具)
      安装方法:
    /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
    
    1. Node(Javascript后端,主要用他的npm包管理工具)
      安装方法:
    brew install node
    

    注意:若安装速度太慢,可考虑换国内的brew源

    1. react-native-cli(React-Native命令行工具)
      安装方法:
    npm install -g react-native-cli
    

    注意:若安装速度太慢,可考虑换[国内的淘宝npm源]http://npm.taobao.org/)

    1. Xcode
      安装方法:
      App Store,版本Xcode7以上
    2. Android Studio
      安装方法:
      主要是下载正确的SDK,请参照此目标平台为Android的文章
    3. Watchman(用于检测文件变化)
      安装方法:
    brew install watchman
    

    测试安装

    react-native init AwesomeProject //下载react native的项目模版并命名为AwesomeProject
    cd AwesomeProject
    react-native run-ios //启动该项目的iOS模拟器并运行
    

    若能成功启动,则你的环境已配置好,可以开始开发啦!

    相关文章

      网友评论

      • JamesSawyer:请问react-native-cli 和 create-react-native-app 有什么区别吗
        林檎果:@JamesSawyer 不客气哈,加油学习~
        JamesSawyer:@linxinzhe 哦哦 谢谢解答
        林檎果:@JamesSawyer create-react-native-app相对于react-native-cli剥离了android和ios的编译环境

      本文标题:设置React Native

      本文链接:https://www.haomeiwen.com/subject/bhekqftx.html