环境配置
1.brew install node node环境是启动本地server开发环境，实时预览，编译，打包都是基于node.js的相应的npm包完成的，react native的开发环境中也涉及到这些所以node.js是必须安装的基础环境
测试安装是否成功：node -v 控制台出现下面字样说明成功
➜ ~ node -v
v16.3.0
➜ ~
2.brew install watchman 是由 Facebook 提供的监视监视文件并且记录文件的改动情况，当文件变更它可以触发一些操作,例如执行一些命令等等，可以提高开发时的性能
3.npm install -g react-native-cli 方便我们使用react-native命令去创建项目和运行项目
4.react-native init MyApp11 --version 0.44.3 0.45 及以上版本需要下载很多第三方库编译。这些库在国内即便翻墙也很难下载成功，导致很多人无法运行。所以此处指定版本进行创建项目。执行过程比较长耐心等待，出现以下信息说明创建成功。
To run your app on iOS:
cd /Users/mac2021/Desktop/MyApp11
react-native run-ios
- or -
Open ios/MyApp11.xcodeproj in Xcode
Hit the Run button
To run your app on Android:
cd /Users/mac2021/Desktop/MyApp11
Have an Android emulator running (quickest way to get started), or a device connected
react-native run-android
5.按照上面提示执行下面命令
cd /Users/mac2021/Desktop/MyApp11 进入工程目录
react-native run-ios 运行iOS项目
6.此时报错Could not find iPhone 6 simulator，因为项目创建时是默认使用iPhone 6运行项目，需要修改下面两处配置文件：
找到MyApp11/node_modules/react-native/local-cli/runiOS/findMatchingSimulator.js 进行修改下面代码
// if (version.indexOf('iOS') !== 0) {
// continue;
// }
if (version.indexOf('iOS') !== 0 && !version.includes('iOS')) {
continue;
}
// if (simulator.availability !== '(available)') {
// continue;
// }
if (simulator.isAvailable !== true) {
continue;
}
找到MyApp11/node_modules/react-native/local-cli/runiOS/runiOS.js 将默认模拟器改成Xcode 已经有的模拟器，我改的是：default: 'iPhone 8',
module.exports = {
name: 'run-ios',
description: 'builds your app and starts it on iOS simulator',
func: runIOS,
examples: [
{
desc: 'Run on a different simulator, e.g. iPhone 5',
cmd: 'react-native run-ios --simulator "iPhone 5"',
},
{
desc: 'Pass a non-standard location of iOS directory',
cmd: 'react-native run-ios --project-path "./app/ios"',
},
{
desc: "Run on a connected device, e.g. Max's iPhone",
cmd: 'react-native run-ios --device "Max\'s iPhone"',
},
],
options: [{
command: '--simulator [string]',
description: 'Explicitly set simulator to use',
default: 'iPhone 8',
} , {
command: '--configuration [string]',
description: 'Explicitly set the scheme configuration to use',
} , {
command: '--scheme [string]',
description: 'Explicitly set Xcode scheme to use',
}, {
command: '--project-path [string]',
description: 'Path relative to project root where the Xcode project '
+ '(.xcodeproj) lives. The default is \'ios\'.',
default: 'ios',
}, {
command: '--device [string]',
description: 'Explicitly set device to use by name. The value is not required if you have a single device connected.',
}, {
command: '--udid [string]',
description: 'Explicitly set device to use by udid',
}, {
command: '--no-packager',
description: 'Do not launch packager while building',
}],
};
- Print: Entry, ":CFBundleIdentifier", Does Not Exist 报错，是因为8081端口被占用问题，用Xcode 打开MyApp11文件中的iOS项目，全局搜索8081并修改没有占用的端口，此处我改为8089。
8.找到MyApp11/node_modules/react-native/local-cli/server/server.js 将端口号修改为8089，再运行项目
9.找到MyApp11/node_modules/react-native/React/Base/RCTModuleMethod.m
//static BOOL RCTParseUnused(const char **input)
//{
// return RCTReadString(input, "__unused") ||
// RCTReadString(input, "__attribute__((unused))");
//}
修改后
static BOOL RCTParseUnused(const char **input)
{
return RCTReadString(input, "__attribute__((unused))") ||
RCTReadString(input, "__attribute__((__unused__))") ||
RCTReadString(input, "__unused");
}
- 运行成功
- 创建高版本RN 项目 ：react-native init rnProject1 默认是最新版本 使用Webstorm 打开项目，注意要修改端口号，不然运行不起来。选中WebStorm 打开项目中的node_modules -> Replace in Files -> 改8081为8082 。在控制台运行：react-native run-ios