要新建一个 React Native 项目,你可以使用 React Native 官方推荐的工具 React Native CLI 或者 Expo。两者的区别在于:React Native CLI 提供更多对原生代码的访问权限,适合构建复杂的应用;而 Expo 是一个开发工具链,简化了许多设置,非常适合快速启动项目,尤其是小型应用或原生功能需求不高的项目。
下面我将分别介绍如何使用 React Native CLI 和 Expo CLI 来创建一个新的 React Native 项目。
方法 1:使用 React Native CLI
1. 安装必要的工具
你需要安装以下工具:
- Node.js :JavaScript 运行时,可以从 Node.js 官网下载并安装。
- React Native CLI:命令行工具,用于创建和管理 React Native 项目。
- Android Studio (用于 Android 开发)或 Xcode(用于 iOS 开发)。如果只开发 Android 应用,安装 Android Studio 即可。
2. 安装 React Native CLI
打开终端(或命令行窗口),运行以下命令来全局安装 React Native CLI:
bash
npm install -g react-native-cli
3. 创建一个新项目
运行以下命令以创建一个新的 React Native 项目,项目名称可以根据你需求自定义:
bash
npx react-native init MyNewProject
这将创建一个名为 MyNewProject
的新 React Native 项目。
4. 运行项目
在项目目录下执行以下命令来启动应用:
-
运行 Android 模拟器:
首先确保你已经打开了 Android Studio 并配置好 Android 虚拟设备(AVD)。然后,运行:
bashnpx react-native run-android
-
运行 iOS 模拟器:
如果你在 macOS 上并安装了 Xcode,可以使用以下命令运行 iOS 模拟器:
bashnpx react-native run-ios
注:要运行 iOS 应用,你需要在 macOS 上,并且安装了 Xcode。
5. 开发与调试
一旦模拟器成功启动,你就可以开始在项目文件夹的 App.js
文件中编写代码。每当你保存更改时,React Native 将自动热更新你的应用,无需重新编译。
方法 2:使用 Expo CLI
如果你不需要使用复杂的原生功能,或希望快速开始开发,Expo 是更简单的一种方式,它不需要在初期配置 Android Studio 或 Xcode。
1. 安装 Expo CLI
运行以下命令安装 Expo CLI 工具:
bash
npm install -g expo-cli
2. 创建一个新项目
运行以下命令创建一个新的 Expo 项目:
bash
expo init MyNewProject
接下来会提示你选择一个模板(例如空白模板或带有一些示例代码的模板)。选择适合你的项目的模板。
3. 进入项目目录
bash
cd MyNewProject
4. 启动项目
运行以下命令启动项目:
bash
expo start
这将启动一个开发服务器,你可以使用 Expo Go 应用在 Android 或 iOS 设备上扫码运行你的应用,或者直接在浏览器中查看调试信息。
- 如果你要在 iOS 模拟器 或 Android 模拟器 上运行,可以选择在 Expo 提供的界面中点击对应的按钮:
- Press
i
to open iOS simulator (on macOS). - Press
a
to open Android emulator (if you have one installed).
- Press
5. 开发与调试
和 React Native CLI 类似,你可以直接编辑项目中的 App.js
文件,保存后应用会自动刷新更新。
React Native CLI 和 Expo 的对比
功能 | React Native CLI | Expo CLI |
---|---|---|
复杂的原生功能 | 适合,允许直接修改原生代码 | 限制较多,不适合需要自定义原生功能的项目 |
开发体验 | 需要设置模拟器(Android Studio/Xcode) | 更简单的设置,无需复杂的原生环境 |
构建流程 | 手动设置构建环境,需要更多配置 | 自动化构建流程,适合快速原型开发 |
调试设备 | 支持通过模拟器和物理设备调试 | 支持通过 Expo Go 应用进行快速调试 |
代码共享性和性能 | 可直接与原生代码交互,性能更优 | 性能稍逊色,但开发速度较快 |
适用场景 | 复杂、原生功能丰富的应用 | 简单、快速开发或轻量级的应用 |
总结
如果你需要使用复杂的原生功能,或者希望完全掌控项目的原生部分,那么选择 React Native CLI 是最佳方案。如果你刚刚开始 React Native 开发,或者想快速搭建一个跨平台应用而不需要复杂的原生功能,那么使用 Expo 是非常方便的选择。