前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >React Native之hellWord

React Native之hellWord

作者头像
xiangzhihong
发布2018-02-05 11:02:07
8520
发布2018-02-05 11:02:07
举报
文章被收录于专栏:向治洪向治洪

初始化项目工程


进入自己的工作空间然后shift+鼠标右键打开命令行窗口执行如下命令创建RN工程HelloWorld:

这里写图片描述
这里写图片描述

然后使用Android Studio打开AVD Manager创建模拟器,在打开Android Studio的时候会提示创建Android项目,我们的目的只是为了打开模拟器,就随便创建一个项目就行了,创建之后就直接打开模拟器:

这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述

几乎是一路next昂- -# , 应该没什么难度。

好,然后直接创建模拟器吧:

这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述

这里最好选择分辨率比自己电脑分辨率小的 ↓ ↓ ↓

这里写图片描述
这里写图片描述

选择自己通过SDK Manager下载的镜像版本

这里写图片描述
这里写图片描述

finish

这里写图片描述
这里写图片描述

这样就ok了

这里写图片描述
这里写图片描述

这里解释一下为什么不直接从下载的SDK目录里面直接通过AVD Manager.exe来创建?

这里写图片描述
这里写图片描述

因为之前试验过,直接从这里创建的话,(有时候)会导致x86硬件加速无法启动,模拟器就会很卡,还有就是如果通过这个exe直接创建模拟器的话,外观会很不好看的╮(╯▽╰)╭


然后进入打开刚刚创建的项目HelloWorld里面运行一下这个程序:

这里写图片描述
这里写图片描述

当电脑默默的饱受编译时大耗费资源后(其实就是电脑卡),可以看到这样的一幕:

这里写图片描述
这里写图片描述

咦?不是应该就ok了吗?怎么还这么喜庆了呢? 

这里写图片描述
这里写图片描述

原来还需要一步,把手机和RN的调试源给连接起来:

这里写图片描述
这里写图片描述

戳 ↓ ↓ ↓ 

这里写图片描述
这里写图片描述

填入调试电脑的ip和端口:

这里写图片描述
这里写图片描述

ip的简便获取方法:

这里写图片描述
这里写图片描述

端口号是在运行react-native run-android 之后出现的React packager窗口上提示的这个程序的端口号,默认是8081:

这里写图片描述
这里写图片描述

设置完后返回点击菜单键弹出菜单,里面点击reload js

这里写图片描述
这里写图片描述

。。。。这就正常了,这才是HelloWorld的正确打开方式 ↓ ↓ ↓

这里写图片描述
这里写图片描述
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016-08-23 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 初始化项目工程
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档