React Native (RN)项目在web、Android和IOS上运行

必须切换淘宝镜像,否则会一直拉取失败

1、环境搭建:

https://reactnative.cn/docs/environment-setup

2、一键清理 Node 依赖与 npx 缓存,在项目根目录执行: (如果有旧的RN cli)

c 复制代码
//删除项目依赖
rm -rf node_modules

//删除 npm 锁文件(如存在)
rm -f package-lock.json yarn.lock

//清理 npm 全局缓存
npm cache clean --force

// 删除 npx 临时缓存
rm -rf ~/.npm/_npx

3、启动顺序

在vscode 终端中先启动(项目根目录)

c‘ 复制代码
//只启动 Metro 打包服务(开发服务器)
npx react-native start

然后在另一个终端中启动(如果只执行,这一步,会自动在外面窗口启动 Metro,会报一些错误:如error (0 , _util.styleText) is not a function.)

c 复制代码
//启动 Metro + 编译并安装 Android 应用到设备上
yarn android / npx react-native run-android
//OR
yarn ios

4、常用命令

Node 是"运行环境",npm 是"它自带的包管理工具"。

c 复制代码
node -v
v22.12.0
npm -v
11.6.2
nvm ls
nvm use v22.12.0

5、Android 预览

6、IOS 预览


相关推荐
花归去16 分钟前
echarts 柱状图曲线图
开发语言·前端·javascript
喝拿铁写前端16 分钟前
当 AI 会写代码之后,我们应该怎么“管”它?
前端·人工智能
老前端的功夫20 分钟前
TypeScript 类型魔术:模板字面量类型的深层解密与工程实践
前端·javascript·ubuntu·架构·typescript·前端框架
Nan_Shu_61444 分钟前
学习: Threejs (2)
前端·javascript·学习
G_G#1 小时前
纯前端js插件实现同一浏览器控制只允许打开一个标签,处理session变更问题
前端·javascript·浏览器标签页通信·只允许一个标签页
@大迁世界1 小时前
TypeScript 的本质并非类型,而是信任
开发语言·前端·javascript·typescript·ecmascript
stevenzqzq1 小时前
android启动初始化和注入理解3
android
GIS之路1 小时前
GDAL 实现矢量裁剪
前端·python·信息可视化
是一个Bug1 小时前
后端开发者视角的前端开发面试题清单(50道)
前端
Amumu121381 小时前
React面向组件编程
开发语言·前端·javascript