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

安装环境

  • 下载 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. Python3基础 内置函数 id

             Python : 3.7.3          OS : Ubuntu 18.04.2 LTS         IDE : pycharm-community-2019.1.3    ...

  2. NodeVisitor

    /* -*-c++-*- OpenSceneGraph - Copyright (C) 1998-2006 Robert Osfield * * This library is open source ...

  3. 使用ffmpeg.exe进行转码参数说明

    使用ffmpeg.exe进行转码参数说明 摘自:https://blog.csdn.net/coloriy/article/details/47337641 2015年08月07日 13:04:32  ...

  4. 【计算机视觉】图像配准(Image Registration)

    (Source:https://blog.sicara.com/image-registration-sift-deep-learning-3c794d794b7a)  图像配准方法概述 图像配准广泛 ...

  5. 【超分辨率】—图像超分辨率(Super-Resolution)技术研究

    一.相关概念 1.分辨率 图像分辨率指图像中存储的信息量,是每英寸图像内有多少个像素点,分辨率的单位为PPI(Pixels Per Inch),通常叫做像素每英寸.一般情况下,图像分辨率越高,图像中包 ...

  6. git的使用学习(二)git的操作使用

    1.创建版本库 什么是版本库呢?版本库又名仓库,英文名repository,你可以简单理解成一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改.删除,Git都能跟踪,以便任何时刻都 ...

  7. 【C/C++开发】C++库大全

    C++特殊限定符(1)--static 当static来修饰类数据成员时,这个类的所有对象都可以访问它.因为值在内存中持续存在,它可以被对象有效共享.这意味着当一个对象改变static数据成员的值时, ...

  8. 关于TV工厂菜单参数的具体说明

    1.ADC Adjust 此项是针对YPbPr.VGA端口进行处理的,在三路R/G/B或者YPb/Pr信号输入到芯片时候,由于存在硬件上的偏差,导致信号和标准信号存在偏差,需要对信号进行ADC校正.光 ...

  9. mysql explain中key_len的作用

    mysql explain中key_len的作用key_len越小 索引效果越好 name的字段类型是varchar(20),字符编码是utf8,一个字符占用3个字节,那么key_len应该是 20* ...

  10. 使用Wifi pineapple(菠萝派)进行Wi-Fi钓鱼攻击

    简介: WiFi Pineapple 是由国外无线安全审计公司Hak5开发并售卖的一款无线安全测试神器. 特性: 用作 Wi-Fi 中间人攻击测试平台 一整套的针对 AP 的渗透测试套件 基于 WEB ...