初始化你人生中的第一个React Native

作者: lyonLiu | 来源:发表于2016-09-04 01:11 被阅读146次

    还是屁话上篇文章末尾也已经提到过了,可以忽略


    第一次初始化时可能会比较慢,因为会去npm下载一些React Native的相关包。
    如果一直卡在Installing react-native package from npm...这儿,可以将镜像改成淘宝镜像

    // 如果这两个命令在安装React Native环境时已经执行,可以跳过
    $ npm config set registry https://registry.npm.taobao.org
    $ npm config set disturl https://npm.taobao.org/dist
    

    开始创建项目


    使用react-native命令来创建我们的第一个项目HelloWorld在终端输入命令行
    这一部分等待时间可能有点长,大家不愿意等待的可以先做店其他事

    // cd到创建项目的目录下,这里我就弄到桌面了
    $ cd /User/liuzhiyuan/Desktop
    
    // 初始化项目
    $ react-native init HelloWorld
    

    项目初始化成功后,运行HelloWorld项目


    **1.CD 到项目根目录 **

    $ cd /User/liuzhiyuan/Desktop/HelloWorld
    

    2.开启服务器 下列两者意义相同,但个人偏好后者

    $ npm start
    

    或者

    $ react-native start
    

    3.运行项目一使用终端打开项目

    // 3.1  cd 到项目中的ios目录
    
    $ cd ios
    
    // 3.2 运行iOS项目
    
    $ react-native run-ios
    

    4.运行项目二不使用终端打开
    找到~/HelloWorld/ios/HelloWorld/HelloWorld.xcodeproj路径,双击Hello.xcodeproj打开
    CMD+R运行即可.此时,终端会自动运行,不用管,也不要关闭.不出意外,你可以看到下面的画面

    如果你看到上述界,我们的项目初始化就已经成功了。

    如果你看到的不是上面的界面,你可以谷歌一下报错信息,或者在文章评论中提出来,一起探讨一下。。


    开发软件WebStorm的安装项目都初始化好了,这里就顺带一提开发工具吧 密码: faqp

    真的只是一提,自己点击右边安装包下载链接,里面有破解教程 ----->安装包下载链接,附破解方法


    说到这里就先告一段落了

    上面初始化项目教程跟开发工具的下载都完成后,大家就可以进入react-native的开发了,大家可以进入------>React Native官方文档中文版 自学,也可以关注@iOSlyon后续的React-native文章。

    相关文章

      网友评论

        本文标题:初始化你人生中的第一个React Native

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