如果你的 React Native 项目之前一直运行的没有问题,但升级至 Xcode10.2 后发现很多莫名其妙的问题,请跟着我一步步来排查。
1、无法编译通过
用新版 Xcode 10.2 打开 iOS 项目,逐步找到 File -> Project Settings -> Build System
将默认的 New Build System
更改为 Legacy Build System
,如下图所示:
1.1 New Build System 与 Legacy Build System 是什么关系
因为苹果以 Xcode 9 后就添加了一个名为 New Build System
构建系统,值为默认不选中
。但 Xcode 升级至 10.2 后就改成了默认选中
,到现在(2019-4-19)Facebook 还没有修复好,所以我们就「倒霉」了。
Legacy Build System
意为传统
构建系统,只需切换至该选项即可正常 build 项目。
1.2 New Build System 有什么特点
New Build System
更加严格检测循环引用,并且会给出提示,如图:
这对程序员很友好,可以更方便检测出循环引用,避免内存泄漏。New Build System
不支持标准的 Clean,改为支持 Clean Build Folder
。
注:如果你公司有 CI 系统,先别着急把 CI 系统的那台电脑升级至 Xcode 10.2。
2、react-native run-ios 无法运行
当我们按照之前的方式,react-native run-ios
,会报 Could not find iPhone X simulator
,我暂时还没有找到好的解决办法,等待 facebook 来修复这个 bug,我们先用 Xcode 来 Build 项目(2019-4-19)。
好消息来了,终于被我找到办法解决了(2019-4-20)。
新建一个名为 fix-find-matching-simulator.js
,放在文件存在如:src/utils/
目录下,然后将如下代码粘贴进去:
const fs = require('fs');
const path = require('path');
// 注意:这里退 2 层,是因为我放到 src/utils/ 里去了
const projectPath = `${__dirname}/../..`;
const jsFile = '/node_modules/react-native/local-cli/runIOS/findMatchingSimulator.js';
const jsFilePath = path.resolve(projectPath + jsFile);
try {
let fileContent = fs.readFileSync(jsFilePath, 'utf-8');
const originValue1 = /'iOS'/g;
const replaceValue1 = "'com.apple.CoreSimulator.SimRuntime.iOS'";
fileContent = fileContent.replace(originValue1, replaceValue1);
const originValue2 = /'tvOS'/g;
const replaceValue2 = "'com.apple.CoreSimulator.SimRuntime.tvOS'";
fileContent = fileContent.replace(originValue2, replaceValue2);
fs.writeFileSync(jsFilePath, fileContent, 'utf8');
console.log('🎉 🎉 🎉, cannot find matching simulator 🐛 is fixed 👍👍👍.');
} catch (e) {
console.log(e);
}
然后在 package.json
里添加如下命令脚本
"scripts": {
...
"fix-find-matching-simulator": "node src/utils/fix-find-matching-simulator.js",
...
},
以后每次只需 yarn fix-find-matching-simulator
or npm run fix-find-matching-simulator
即可。
你可能会问,我执行 yarn 或 npm 后,这个文件里的内容不就退回
去了吗?
我已经替你考虑好了,只需在 scripts 里加两行就好了,代码如下:
"scripts": {
...
"fix-find-matching-simulator": "node src/utils/fix-find-matching-simulator.js",
"postinstall": "yarn fix-find-matching-simulator",
"postuninstall": "yarn fix-find-matching-simulator",
...
},