详细可参考 官方文档,这里进记录一些重要过程。

安装环境

  • 下载 Android Studio 选择 Custom 进行安装:

    • Android SDK
    • Android SDK Platform
    • Performance (Intel ® HAXM) (AMD 处理器看这里)
    • Android Virtual Device
  • 安装各 SDK,推荐使用 choce 进行安装,非常简单:

    powershell -NoProfile -ExecutionPolicy Bypass -Command "iex  ((new-object net.webclient).DownloadString('https://choc olatey.org/install.ps1' ))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin 不行的话使用:@powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https ://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
  • 使用 choco 安装 jdk8,python2

    choco install python2 jdk8
  • 安裝 yarn react-native-cli

    npm install -g yarn react-native-cli
  • 使用 VSCode 进行环境配置,参考:https://www.cnblogs.com/hl1223/p/11049968.html

  • 创建 React Native 应用

    react-native init ReactNativeDouban

运行应用

由于 Android Studio 模拟器特别占内存,所以推荐使用一些其他的三方模拟器进行开发,如 夜神模拟器

使用夜神模拟器,需要将 Android\SDK\platform-tools 目录下的 adb.exe 拷贝到夜神模拟器的安装目录的bin目录下,重命名为 nox_adb.exe 替换目录里的 nox_adb.exe 文件。

此时 adb devices 就可以看到如下内容

在 VSCode 按 F5 运行 应用,发现夜神模拟器连接不了设备,红屏报错:Could not connect to development server,如下:

这是因为模拟器和电脑不在同一个网段,需要让模拟器连接 RN 开的代理接口,过程如下(点击菜单、选择 dev setting,点击 debug server 输入本机ip和8081端口):

然后在重新运行即可出现正确内容:

React Native 开发豆瓣评分(一)环境搭建&配置模拟器的更多相关文章

  1. React Native 开发豆瓣评分(八)首页开发

    首页完成效果展示: 一.开发占位图组件 在没有数据的时候使用占位图替代 items 的位置. 在 components 目录里创建 moviesItemPlaceholder.js import Re ...

  2. React Native 开发豆瓣评分(二)路由配置

    路由管理使用官方推荐的 React Navigation; 配置环境 安装相关依赖 yarn add react-navigation react-native-gesture-handler Lin ...

  3. React Native 开发豆瓣评分(五)屏幕适配方案

    前言 React Native 是以实际像素 dp 为单位的,这导致在不同分辨率的屏幕会有不一样的显示情况. 在原生 Android 中,可以根据不同的分辨率添加不同的样式目录,以解决不同分辨率的问题 ...

  4. React Native 开发豆瓣评分(四)集中管理 fetch 数据请求

    豆瓣评分的API接口 接口是从网上查找的,看样子应该是微信小程序里面扣出来的(ua 里面有 wechatdevtools) 接口都需要设置apiKey(054022eaeae0b00e0fc068c0 ...

  5. React Native 开发豆瓣评分(三)集成 Redux

    什么是 redux redux 是一个用于管理 js 应用状态(state)的容器.比如组件 A 发生了变化,组件 B 要同时做出响应.常见的应用场景就是用户的登录退出操作:未登录状态,个人中心显示登 ...

  6. React Native 开发豆瓣评分(七)首页组件开发

    首页内容拆分 看效果图,首页由热门影院.豆瓣热门.热门影视等列表组成,每个列表又由头加横向滑动的 电影海报列表构成. 所以可以先把页面的电影海报.评分.列表头做成组件,然后在使用 ScrollView ...

  7. React Native 开发豆瓣评分(六)添加字体图标

    添加依赖 yarn add react-native-vector-icons Link 依赖 react-native link react-native-vector-icons 使用默认字体图标 ...

  8. React Native在window下的环境搭建(二):创建新项目

    React Native创建一个新项目: react-native init TestAndroidApp 提示:你可以使用--version参数(注意是两个杠)创建指定版本的项目.例如react-n ...

  9. React Native在window下的环境搭建(一)

    React Native官方开发文档 以下是本人抄录的: 初次接触React Native感觉和React很像,却是有点类似,但不完全是,React Native有自己的组件对象,不过它也自定义的组件 ...

随机推荐

  1. Typescript中的可索引接口 类类型接口

    /* 5.typeScript中的接口 可索引接口 类类型接口 */ /* 接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用 ...

  2. Java回调机制在RPC框架中的应用示例

    完整源码: https://gitee.com/shiyanjun/x-callback-demo 应用场景描述: 服务提供者在项目启动时,创建并启动一个TCP服务器,然后将自己提供的所有服务注册到注 ...

  3. 【Python】使用POST方式抓取有道翻译结果

    1.安装requests库 2.打开有道翻译,按下F12,进入开发者模式,输入我爱青青,点击Network,再点击XHR 3.撰写爬虫 import requestsimport json # 使用有 ...

  4. ES6深入浅出-9 Promise-2.Promise的用法

    回调是不需要return 就可以传递数据.缺点就是嵌套多了就成了回调地狱 回调的另外一个问题拿不准应该怎么去传这个参数.以为node.js为例.nodejs有个readFile去读取文件,读取成功就用 ...

  5. 【435】NULL '\0' 0 等在 C 语言中的区别

    参考:C/C++语言中NULL.'\0’和0的区别 参考:空字符串.'\0'.0与NULL的区别以及数组清零的特点分析 在 C语言 中没有 空字符 这个东西 '',不过有 空字符串 "&qu ...

  6. Asynchronous Streaming Request Processing in Spring MVC 4.2 + Spring Boot(SpringBoot中处理异步流请求 SpringMvc4.2以上)

    With the release of Spring 4.2 version, Three new classes have been introduced to handle Requests As ...

  7. 一些Python中的二维数组的操作方法

    一些Python中的二维数组的操作方法 这篇文章主要介绍了一些Python中的二维数组的操作方法,是Python学习当中的基础知识,需要的朋友可以参考下 需要在程序中使用二维数组,网上找到一种这样的用 ...

  8. 容器版jenkins安装并且实现使用宿主机docker命令,采用的是docker outside deocker,带jdk、添加maven、git

    docker版jekins使用宿主机docker命令 docker版jekins安装,实现CI/CD,也就是实现在容器里面使用宿主机docker命令,这样方式为:docker outside deoc ...

  9. 深度技术W10系统中绑定MAC地址和IP地址的设置技巧

    深度技术W10系统中绑定MAC地址和IP地址的设置技巧分享给大家,感兴趣的用户,请一起来了解下,以备以后作参考,具体如下:1.点击“开始——搜索”,输入CMD命令,然后在CMD上右键选择以管理员身份运 ...

  10. QT 源码分析--1

    Ref: http://blog.sina.com.cn/s/blog_6e80f1390100qoc0.html 安装qt之后(我使用的是online自动安装),安装目录下有\5.10.1\Src\ ...