zoukankan      html  css  js  c++  java
  • react native 环境配置

    1. 安装Homebrew 
    Homebrew主要用于安装后面需要安装的watchman、flow 
    打开MAC的终端,输入如下命令: 

    ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 

    经过漫长的等待后,安装完成。

    执行 brew doctor 命令。

     按enter键 ,继续配置 。当你看到   ==>Installation successful!  那么就安装成功了

    2.安装nvm和nodejs 
    nvm是用于nodejs版本管理的工具,用于安装nodejs。 
    对于nvm应该可以使用brew直接安装,但是我没有用这个安装,读者可以自己使用如下命令试试: 

    brew install nvm 

    我使用的另一种方式,在终端中输入如下的命令: 

    brew install node . 该命令执行后,自动装好node和npm 

    这个用于安装nodejs和npm。npm用于nodejs包依赖管理的工具。 

    3. 安装watchman 
    watchman是用于监听文件变化的工具,应该是用于监听文件变化,然后界面做出响应。执行如下命令: 

    brew install watchman 

    4. 安装flow 
    flow我个人理解的是用于静态分析js语法错误的工具,能够更早的js的语法错误。执行如下的命令: 

    brew install flow 

    到这里基本的环境就配置好了,下面创建一个iOS的例子,在终端中将目录切换到你保存工程的目录,然后执行如下的命令:

    $ npm install -g react-native-cli  
     $ react-native init AwesomeProject     
    $ cd AwesomeProject/
      1. 在git上下载,或者直接clone项目 React native

      2. npm install -g react-native-cli 安装命令行界面工具。

      3. 在react-native的项目目录下使用react-native命令行命令init初始化一个demo项目。react-native init DemoProject 
        初始化完成后,在DemoProject目录下会看到DemoProject.xcodeproj文件,其中的index.ios.js就是控制项目的js文件,简单的demo,主要界面和逻辑都是在这个js文件里。

    (  注意:安装nvm

    1)我们使用Git把nvm给git下来

    打开终端,复制黏贴  

    git clone https://github.com/creationix/nvm.git ~/.nvm && cd ~/.nvm && git checkout `git describe --abbrev=0 --tags`   

    2)输入 . ~/.nvm/nvm.sh 或者 soure ~/.nvm/nvm.sh  启动nvm管理器

    3)配置下nvm管理器,使我们打开终端的时候自动启动nvm

    (1)、在终端输入:

    vi ~/.bashrc

    (2)复制黏贴  

    export NVM_DIR="$HOME/.nvm"

    [ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

    然后  esc退出编辑 ,shit +:  输入   :wq!     回车


    vi ~/.bashrc

    3)vi ~/.profile (重复上一步操作)

    4)nvm install node && nvm alias default node

    等待安装完成,安装完成之后我们就可以通过npm来管理node了!

    5)国内的网络npm自带的源真的卡出了翔,所以我们要换成淘宝的源

    npm install -g nrm

    nrm use taobao

        Registry has beensetto: http://registry.npm.taobao.org/

    这样子我们就换成了淘宝的源了

    ) 

    3.创建项目

    1)

    npm install -g react-native-cli --verbose

    2)在你自己创建的文件目录里快速生成一个RN项目

    在桌面创建一个新的文件

    react-native init 项目名称 --verbose

    注:

    执行init时切记不要在前面加上sudo(否则新项目的目录所有者会变为root而不是当前用户,导致一系列权限问题,请使用chown修复)。

     

    3)

    打开项目Project -> ios->项目Project.xcodeproj

    com+R  启动项目

    注:可能nvm配置路径问题,项目运行的时候可能会出现错误

    解决方法:

    在项目启动中,cd 到AwesomeProject目录下,执行

    react-native start

    (之前的版本是npm start 新的版本已经改成了react-native start)

    // --------------

    1.初始化node

    在终端中,定位到iOS项目的根目录,运行
            npm init     然后一路回车即可

    注意:node项目的命名不能使用大写字母,所以指定name时输入simple-native 后回车

    执行完毕之后,在项目根目录下生成了一个package.json文件,类似于CocoaPods的Podfile文件,用来管理项目依赖

    2.安装React Native

    再项目根目录下运行
    npm install --save react-native

    由于国内的网络问题,npm安装比较缓慢,可以使用淘宝npm镜像替代

    安装完毕之后,根目录下会生成node_modules文件夹,里面保存了react和react-native的依赖--save参数会在package.json文件中保存react和react-native的依赖声明

    3.cocoapods

    在项目根目录下,运行
    pod init

    在项目根目录下生成了Podfile,用任何编辑器打开,编写React Native的依赖

    (参考链接react native网:http://reactnative.cn/docs/0.35/getting-started.html#content    。        欢迎大家来提意见!!!)

  • 相关阅读:
    分享一个难得的YiBo微博客户端应用源码Android版
    js的cookie操作及知识点详解
    c#中out参数的作用
    取消安卓listview,scrollview,gridview滑动时候边缘模糊问题
    分块+deque维护 Codeforces Round #260 (Div. 1) D. Serega and Fun
    并发
    感想
    windows服务器允许MySQL远程连接
    C. Vasya And The Mushrooms
    cf1017 D. The Wu
  • 原文地址:https://www.cnblogs.com/Ruby-Hua/p/6002791.html
Copyright © 2011-2022 走看看