blog icon indicating copy to clipboard operation
blog copied to clipboard

React-Native 环境安装及调试(Mac版)

Open Hancoson opened this issue 6 years ago • 0 comments

准备工作

安装必要的软件,这里就不详细说了,具体可参考官方文档

  • 安装React-Native Cli npm install -g create-react-native-app

  • Xcode 安装升级到 8+

  • 初始化RN项目 react-native init rnHelloWord,可能会比较慢,要耐心等到

启动项目

  • 进入项目并启动

    cd rnHelloWord
    npm start
    

    也可以使用Xcode启动项目,点击ios/AwesomeProject.xcodeproj,再点击右上角的Run即可跑起来。

调试

模拟器调试

项目启动后,点击模拟器command+d - 选择 Enable Live Reload,监控RN代码的改动(热替换),可直接修改代码,即可查看最新的修改。

真机调试

PC上的设置

  • 手机通过USB连接电脑,在Xcode中选择手机作为目标设备。

  • 如图填写,并选择:

  • 同时相关的 Tests target 里同样也要选择使用的开发者账号。

这样基本工作就完成了,可以点击Run启动啦~~

手机上设置

  • 这时手机上就安装了一个rnHelloWord的app,点击启动可能会弹一个‘不受信任的’提示,怎么办呢?

  • 不要着急,我们可以在手机上设置-通用-设备管理-添加信任

  • 然后就可以正常启动了

  • 应用启动后,只需要摇一摇手机可以调出调试菜单,里面具体功能同模拟器一样,这里就不再说明了。

接下来就可以开发了。


结束语

React-Native运行环境安装难于上青天,安装成功后你离成功就不远了。它的语法相近于React,撸起袖子~~~写代码吧。

Hancoson avatar Nov 10 '17 09:11 Hancoson