昨天 React Native 官方团队在 reddit 上发起了一次 AUA(ask us anything)活动，地址在文末。看到这个活动的时候，我脑海里想到的第一个问题就是，他们怎么看待 Flutter 的？结果打开活动后，发现已经有人问了，而且还得到了官方的回复。

提问者：

你们是怎么看待 Flutter 的，和 Flutter 比起来 React Native 有什么优劣？

官方回复：

我认为 React Native 和 Flutter 的目标是完全不同的，因此在实现上也采取了完全不同的方法，所以如何看待二者，就取决于你要达到什么样的目的了。举例来说，React Native 更倾向于将每个平台各自的特性和组件样式进行保留，而 Flutter 是通过自己的渲染引擎去渲染组件样式，以代替平台原生的效果。这取决于你想做什么以及想做成什么样，这个应该就是你最需要考虑的事情了。

话里有话：

看完了也没说哪里好，哪里不好，很标准的官方回复。看来是早就想好了答案，算准了肯定会有人问这个。而且看完这个回复，我感觉像是在说：“小孩才做选择，大人就都要！”

除了这个绕不开的问题以外，还有一个我认为比较关键的问题，就是关于 React Native 未来的发展。当然，这个问题也有人问了，就排在热门第一个。

提问者：

React Native 已经发布了有 4 年之久了，想问下你们对它未来 4 年的发展有什么想法呢？

官方回复：

我认为未来 React Native 的发展将有两个阶段。

在第一个阶段发展结束的时候，我认为 React Native 将成为一个把 React 语法带到任何一个原生平台上的框架。现在我们已经可以看到，通过 Fabric 以及 TurboModules 会让 React Naitve 变得更易用更通用。我希望 React Native 可以支持任何移动、桌面、AR/VR 平台。目前我们应该也可以看到，公司希望 React Native 能运行在除了 Android 和 iOS 以外的设备上。

在我开始讲述第二阶段前，首先需要明白我们要通过 React Native 达到什么目的是非常重要的，我们在尝试把 React 带到原生界面开发中。我们认为 React 在表现力、直观性以及灵活性之间，做到了一个非常好的平衡，以提供良好的性能和灵活的界面。

在第二阶段发展结束的时候，我认为 React Native 将会重新回归 "React"，这意味着很多事情，并且他的定位也会更加模糊。但是，这意味着在 React Native 和 React for web 之间更加聚合与抽象。这可能意味着会将抽象的级别提高到目前开发人员熟悉的 Web 水平上来。然而有趣的是，Twitter 整个网站已经使用 React Native（react-native-web）编写了。虽然这看起来像“代码共享”的 holy grail。但其实没有必要，我相信它可以在任何平台上都能带来高质量的体验。

话里有话：

这段话的大概意思就是，未来，第一阶段，React Native 计划先把 React 搬到所有原生平台上，然后第二阶段，就是逐渐抹平 React Native 和 React for web 之间的区别，代码会朝着 Web 开发者熟悉的方向进行抽象和聚合

从这段话中，给我的感觉像是在说，React Native 是 React 的扩充而已，不要老拿我们和 Flutter 比，我们不一样，OK？至于未来怎么发展，那肯定是不会脱离我们庞大的 React 用户群体的。这本来就不是开发出来给你们原生开发者用的，而是给 Web 开发者扩充技能栈的。这么说，可能也是想避开和 Flutter 的正面交锋吧？毕竟在原生开发领域，Google 的技术积累比 Facebook 还是要深厚。

现在这个活动已经有超过 200 多条回复了，其中有很多大家比较关心的问题，我觉得所有在用 React Native 的开发者都可以去看一下。由于内容实在是太多了，我也就不逐一翻译了。

还有一点需要特别提一下，React Native 为什么要在这个时候搞这次 AUA 活动呢？正如他们在活动详情里提到的，因为 RN0.59 正式版马上就要发布了，官方宣称这次更新带来了“非常值得期待”的更新，所以可能是想出来好好宣传一下吧。

如果你也有关注 React Native 开发，可以关注我的公众号，会不定时分享一些国内外的动态，当然不只有 React Native，也会分享一些关于移动开发的其他原创内容。

围观地址：（要梯子）

https://www.reddit.com/r/reactnative/comments/azuy4v/were_the_react_native_team_aua/

1、react-native-cli

无法使用exp服务

react-native init program-name  #初始化项目

npm start（react-native start） #在项目目录下启动 js service

react-native run-android #已连接真机或开启模拟器前提下，启动项目

react-native run-ios #已连接真机或开启模拟器前提下(仅支持mac系统)，启动项目

2、create-react-native-app

create-react-native-app是React 社区孵化出来的一种无需构建配置就可以创建>RN App的一个开源项目,一个创建react native应用的脚手架工具(最好用，无需翻墙

初始化后项目可使用exp服务

安装使用

npm install -g create-react-native-app #全局安装

使用create-react-native-app来创建APP

create-react-native-app program-name #初始化项目

cd program-name #进入项目目录

npm start #启动项目服务

create-react-native-app常用命令

npm start  #启动本地开发服务器，这样一来你就可以通过Expo扫码将APP运行起来了

npm run ios   #将APP运行在iOS设备上，仅仅Mac系统支持，且需要安装Xcode

npm run android  #将APP运行在Android设备上，需要Android构建工具

npm test # 运行测试用例

如果本地安装了yarn管理工具，会提示使用yarn命令来启动管理服务

运行项目

用Expo App扫码启动项目服务屏幕上自动生成的二维码，program-name就可以运
行在Expo App上

expo下载配置参考下一条

3、Expo

Expo是一组工具、库和服务，可以通过编写JavaScript来构建本地的ios和Android应用程序
需翻墙使用，下载资源速度慢

安装使用

PC上通过命令行安装expo服务

1、npm install exp --global #全局安装 简写： npm i -g exp

手机上安装Expo Client App（app store上叫Expo Client）
安装包下载地址：expo官网
手机安装好后注册expo账号（必须，后续用于PC expo 服务直接通过账号将项目应用于expo app）

提示：为了确保Expo App能够正常访问到你的PC，你需要确保你的手机和PC处于同一网段内或者他们能够联通

初始化一个项目（Create your first project）

2、exp init my-new-project  #初始化项目,会要求你选择模板

The Blank project template includes the minimum dependencies to run and an empty root component 空白项目模板包含运行的最小依赖项和空白根组件

The Tab Navigation project template includes several example screens Tab Navigation项目模板包含几个示例屏幕

报错：

Set EXPO_DEBUG=true in your env to view the stack trace. 报错如下图
解决方法：下载Expo XDE（PC客户端使用） --初始化项目需翻墙

注：使用命令行初始化项目可能会卡在下载react-native资源，可转换成XDE初始化项目，再使用命令行启动项目并推送

3、cd my-new-project #进入项目目录

4、exp start #启动项目，推送至手机端

启动项目后会要求你输入你在App上注册的Expo账号和密码

初始化后项目结构

主要windows下android目录结构

|- program-name             | 项目工作空间
|- android              | android 端代码  
    |- app                  | app 模块
        |- build.gradle         | app 模块 Gradle 配置文件
        |- progurad-rules.pro   | 混淆配置文件
        |- src/main             | 源代码
            |- AndroidManifest.xml  | APK 配置信息 
            |- java                 | 源代码
                |- 包名                 | java 源代码
                    |- MainActivity.java    | 界面文件, (加载ReactNative源文件入口)
                    |- MainApplication.java | 应用级上下文, (ReactNative 插件配置)
            |- res                  | APK 资源文件
    |- gradle               | Gradle 版本配置信息
    |- keystores            | APK 打包签名文件(如果正式开发需要自己定义修改签名文件)
    |- gradlew              | Gradle运行脚本, 与 react-native run-android 有关
    |- gradlew.bat          | Gradle运行脚本, 与 react-native run-android 有关
    |- gradle.properties    | Gradle 的配置文件, 正常是 AndroidHome, NDK, JDK, 环境变量的配置
    |- build.gradle         | Gradle的全局配置文件, 主要是是配置编译 Android 的 Gradle 插件,及配置 Gradle仓库
    |- settings.gradle      | Gradle模块配置
|- ios                  | iOS 端代码
|- node_modules         | 项目依赖库
|- package.json         | node配置文件, 主是要配置项目的依赖库,
|- index.android.js     | Android 项目启动入口
|- index.ios.js         | iOS 项目启动入口

package.json文件说明

dependencies

• 项目的依赖配置
  
  
  
  • 依赖配置,配置信息配置方式
    
    
    
    • “version” 强制使用特定版本
    
    
    • “^version” 兼容版本
    
    
    • “git…” 从 git版本控制地址获取依赖版本库
    
    
    • “path/path/path” 指定本地位置下的依赖库
    
    
    • “latest” 使用最新版本
    
    
    • “>version” 会在 npm 库中找最新的版本, 并且大于此版本
    
    
    • “>=version” 会在 npm 库中找最新的版本, 并且大于等于此版本“
    
    
    
    
  
  
  
  

devDependencies

• 开发版本的依赖库

version

• js 版本标志

description

• 项目描述, 主要使用于做第三方支持库时,对库的描述信息

main

• 项目的缺省入口

engines

• 配置引擎版本信息, 如 node, npm 的版本依赖

**index.*.js
新版RN统一入口：index.js

• 正常只作为项目入口,不做其他业务代码处理

注：
1、虚拟机上很消耗电脑内存, 建议使用真机进行安装测试