React Native 开发豆瓣评分(一)环境搭建&配置模拟器
详细可参考 官方文档,这里进记录一些重要过程。
安装环境
下载 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 开发豆瓣评分(一)环境搭建&配置模拟器的更多相关文章
- React Native 开发豆瓣评分(八)首页开发
首页完成效果展示: 一.开发占位图组件 在没有数据的时候使用占位图替代 items 的位置. 在 components 目录里创建 moviesItemPlaceholder.js import Re ...
- React Native 开发豆瓣评分(二)路由配置
路由管理使用官方推荐的 React Navigation; 配置环境 安装相关依赖 yarn add react-navigation react-native-gesture-handler Lin ...
- React Native 开发豆瓣评分(五)屏幕适配方案
前言 React Native 是以实际像素 dp 为单位的,这导致在不同分辨率的屏幕会有不一样的显示情况. 在原生 Android 中,可以根据不同的分辨率添加不同的样式目录,以解决不同分辨率的问题 ...
- React Native 开发豆瓣评分(四)集中管理 fetch 数据请求
豆瓣评分的API接口 接口是从网上查找的,看样子应该是微信小程序里面扣出来的(ua 里面有 wechatdevtools) 接口都需要设置apiKey(054022eaeae0b00e0fc068c0 ...
- React Native 开发豆瓣评分(三)集成 Redux
什么是 redux redux 是一个用于管理 js 应用状态(state)的容器.比如组件 A 发生了变化,组件 B 要同时做出响应.常见的应用场景就是用户的登录退出操作:未登录状态,个人中心显示登 ...
- React Native 开发豆瓣评分(七)首页组件开发
首页内容拆分 看效果图,首页由热门影院.豆瓣热门.热门影视等列表组成,每个列表又由头加横向滑动的 电影海报列表构成. 所以可以先把页面的电影海报.评分.列表头做成组件,然后在使用 ScrollView ...
- React Native 开发豆瓣评分(六)添加字体图标
添加依赖 yarn add react-native-vector-icons Link 依赖 react-native link react-native-vector-icons 使用默认字体图标 ...
- React Native在window下的环境搭建(二):创建新项目
React Native创建一个新项目: react-native init TestAndroidApp 提示:你可以使用--version参数(注意是两个杠)创建指定版本的项目.例如react-n ...
- React Native在window下的环境搭建(一)
React Native官方开发文档 以下是本人抄录的: 初次接触React Native感觉和React很像,却是有点类似,但不完全是,React Native有自己的组件对象,不过它也自定义的组件 ...
随机推荐
- 关于xadmin的网址收集
https://blog.csdn.net/yambo1992/article/details/80918250 https://www.colabug.com/4728510.html django ...
- pls_integer类型
转: pls_integer类型 2011-08-22 16:49:06 heqiyu34 阅读数 13413更多 分类专栏: Oracle 今天在看一个触发器代码的时候碰到了一个pls_inte ...
- ES6深入浅出-4 迭代器与生成器-3.生成器 & for...of
迭代器平时用的很少.但是如果你是写框架的,你会经常用到迭代器. 生成器是专门用来做迭代器的东西 发布器是要产生一个叫做next的对象,如果你要产生这种对象.就可以使用ES6新出的语法. ES6的新语法 ...
- Qt编写自定义控件64-垂直时间轴
一.前言 垂直时间轴控件,主要用来描述企业发展历程大事件,或者软件版本迭代历史等,通过时间节点和事件描述来直观的展示发展的过程,一般在web网页或者app中经常看到此类控件,尤其是公司的官网关于公司部 ...
- matlab基本函数randperm end数组索引
一起来学演化计算-matlab基本函数randperm end数组索引 觉得有用的话,欢迎一起讨论相互学习~Follow Me 随机排列 语法 p = randperm(n) p = randperm ...
- ABAP DEMO 下拉框
效果展示: *&---------------------------------------------------------------------* *& Report YCX ...
- Python - Django - ORM 常用的字段属性
字段参数: null:用于表示某个字段可以为空 unique:如果设置为 unique=True,则该字段在此表中必须是唯一的 db_index:如果 db_index=True,则代表着为此字段设置 ...
- Eureka 与 zookeeper 的区别、
前言在微服务的开发过程中,如果使用的是 Dubbo 那就必须使用到 Zookeeper ,在使用 Spring Cloud Eureka 时,自然其功能更强大得多.博主也不得不感叹,Spring Cl ...
- vue 静态资源文件夹src下的assets 和static的区别
static下的静态资源在项目打包的时候,直接在dist文件夹下直接把static文件夹打包进去src下的assets,在打包时,vue是按照模块来引入里面的静态资源,一般使用这种方式
- Uncaught Error: `setOption` should not be called during main process.
主要是自己记笔记用,大佬些莫怪! 使用 echart 出现 :Uncaught Error: `setOption` should not be called during main process. ...