react native 初始化工程

youhui / 2024-10-21 / 原文

npx 安装太慢解决办法

https://blog.csdn.net/m0_46423830/article/details/140628277

npm config set registry https://registry.npmmirror.com

 

1、搭建环境 

https://reactnative.dev/docs/set-up-your-environment

2、创建工程

npx @react-native-community/cli init <project_name>


3、解决bundle install太慢的问题

bundle config mirror.https://rubygems.org https://gems.ruby-china.com

4、在ios模拟器上运行 

https://reactnative.cn/docs/running-on-simulator-ios

启动模拟器​

当你完成了初始化 React Native 新项目后,就可以在项目目录下运行npx react-native run-ios来启动模拟器。如果一切配置都没有问题,应该很快就能看到你的应用在 iOS 模拟器上运行起来。

指定模拟的设备类型​

你可以使用--simulator参数,在其后加上要使用的设备名称来指定要模拟的设备类型(目前默认为"iPhone 11")。如果你要模拟 iPhone 4s,那么这样运行命令即可:npx react-native run-ios --simulator "iPhone 4s"

注意:随着RN和Xcode版本迭代更新,默认和可选的模拟设备可能有变化。

你可以在终端中运行xcrun simctl list devices来查看具体可用的设备名称。

xcrun simctl list devices
== Devices ==
-- iOS 17.5 --
    iPhone 15 (xxxxxx) (Shutdown)
    iPhone 15 Plus (xxxxxx) (Shutdown)
    iPhone 15 Pro (xxxxxx) (Shutdown)
    iPhone 15 Pro Max (xxxxxx) (Shutdown)
    iPad (10th generation) (xxxxxx) (Shutdown)
    iPad mini (6th generation) (xxxxxx) (Shutdown)
    

yarn run ios --simulator "iPhone 15 Pro"

 

React Native初始化项目为JavaScript模板而不是Typescript(教程)

原因:
React Native>=0.71版本在项目初始化时默认使用Typescript模板。

React-Native<=0.70版本仍然默认使用JavaScript模板。

 

解决方法1(粗暴):
您可以通过更改文件扩展名并从文件中删除打字稿代码来更改.tsx文件为.js,同时删除tsconfig.json文件。

但是上面的方法会引发很多问题,后面我在进行创建navigation操作的时候引发一系列有关ts错误操作的问题,所以该方法不是很建议。

解决方法2(优雅):
安装<=0.70的react-native版本,即可初始化带有App.js的文件:

react-native<=0.70版本仍然默认使用JavaScript。

要安装 React Native,<=0.70可以在 CLI 上使用以下命令:

npx @react-native-community/cli init <project_name> --version 0.70.0


在这里你可以写你想要的版本。

官方参考:Using TypeScript · React Native