项目环境搭建

114 阅读2分钟

image.png

1.使用expo搭建React Native环境

要使用Expo来搭建React Native应用,你可以遵循以下步骤。Expo是一个流行的框架,它允许你快速搭建和运行React Native应用,而无需安装和配置复杂的原生开发环境。下面是如何使用Expo来开始你的React Native项目的详细步骤:

1.1安装Node.js

首先,确保你的计算机上安装了Node.js。你可以从Node.js官网下载并安装。安装完成后,打开终端或命令提示符,运行node -v来检查Node.js是否正确安装。

1.2安装Expo Cli

在终端或命令提示符中,使用npm(Node包管理器)安装Expo CLI。运行以下命令:

npm install -g expo-cli

1.3创建新的Expo项目

使用Expo CLI创建一个新的React Native项目。打开终端或命令提示符,然后运行以下命令:

expo init MyNewProject

这里MyNewProject是你项目的名称,你可以根据需要更改它。运行这个命令后,Expo CLI会提示你选择一个模板。你可以选择“blank”模板来开始一个空项目,或者选择其他模板如“tabs”或“blank-typescript”等。

image.png

image.png

Expo 官方已经将 CLI 功能整合到了项目本地的 expo 包中,推荐使用新的方式创建和管理 Expo 项目。

npx create-expo-app --template是官方推荐的新项目创建命令,含义如下:

npx:Node.js 自带的包执行工具,可以直接运行 npm 包中的命令,无需全局安装 create-expo-app:Expo 官方提供的新项目创建工具(替代了原来的 expo init) --template:可选参数,用于指定项目模板(如空白模板、TypeScript 模板等) 正确的项目创建方法:

创建默认的空白项目

npx create-expo-app RNTest

或者使用指定模板(例如 TypeScript 模板)

npx create-expo-app RNTest --template expo-template-blank-typescript

创建完成后,进入项目并启动:

cd RNTest
npx expo start

这种方式的优势:

不需要全局安装 expo-cli,避免了版本冲突问题 每个项目可以使用独立的 Expo 工具版本 更好地支持新版本的 Node.js

1.4运行项目

image.png

安卓手机谷歌商店下载expo go,安装后打开APP使用手机扫描二维码后即可进行构建预览

image.png