快速搭建ReactNative跨平台开发iOS

作者: Roy_Liang | 来源:发表于2016-09-24 01:15 被阅读701次

    ReactNative可以进行跨平台开发iOS和安卓,Mac搭建简单如下

    • 安装HomeBrew
    • 安装Node.js
    • 安装watchman 和 flow
    • 安装React Native CLI

    1. 安装HomeBrew

    这是安装包管理器,安装后可以方便后续安装包的安装,HomeBrew官网安装命令
    终端命令

    /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
    
    2.安装Node.js
    (1) Node.js安装方式一

    直接使用HomeBrew安装
    可尝试使用终端命

    brew install node
    

    如不行可尝试第二种方式安装Node.js

    (2)Node.js安装方式二

    先安装nvm,再使用nvm安装和维护升级Node.js(官方文档所述使用的便是这种方法)

    步骤1 安装nvm
    终端命令

    brew install nvm
    

    如图:


    下载完毕nvm后的警告Caveats

    看到一个警告Caveats
    意思是:需要创建一个NVM目录,然后添加以下信息“export NVM_DIR= ……”到配置文件
    那么
    创建nvm目录mkdir ~/.nvm
    打开所述配置文件open ~/.bash_profile
    发现没有配置文件,创建配置文件
    cd
    touch ~/.bash_profile

    创建好配置文件后打开,添加信息
    open ~/.bash_profile

    添加配置信息

    ls -a查看隐藏文件,OK,NVM安装好了

    步骤2 使用nvm安装Node.js

    终端命令

    nvm install node && nvm alias default node
    

    等待……安装完毕

    3. 安装watchman 和 flow

    watchman是React修改source文件的一个工具
    安装终端命令

     brew install watchman
    

    flow是一个JavaScript 的静态类型检查器
    安装终端命令

    brew install flow
    

    关于brew update && brew upgrade命令
    官方文档建议定期运行brew update && brew upgrade 来使您的应用程序保持最新状态。

    4. 安装React Native CLI

    这是个用来开发React Native的命令行工具
    安装终端命令:

    npm install -g react-native-cli
    

    O(∩_∩)O哈哈~大功告成,来一个跨平台项目

    在当前目录新建一个项目

    react-native init HelloReactNative
    
    图示

    完成之后打开这一个项目,同时看到了android和ios

    点击运行iOS里的.xcodeproj
    注:React Native - iOS运行目前需要Xcode 7.0 或更高版本。

    iOS运行结果:

    如图O(∩_∩)O哈哈~

    React Native - iOS开发界面

    --end--


    相关文章

      网友评论

        本文标题:快速搭建ReactNative跨平台开发iOS

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