我也经常遇到类似这样的奇怪报错,最终我的解决方式是遵循,先排除环境问题,再查代码问题。
我们首先从整个的版本入手哈,版本跟我的先对上,因为课程中是和版本强绑定的,版本不满足不能保证 100% 跑的通,等到后面课程你跟的多了,你就有能力自己升级课程了(升级的视频我也在准备中):
首先确保 Homebrew 更新了,系统也更新到最新了,然后 xcode-select --install 也安装了,以及通过 brew 安装的这一坨:
brew install watchman git flow gcc pkg-config cairo libpng jpeg giflib mongodb
最后还是通过 nvm 切换到 Nodejs v4.2.3 的版本,不要跃升到 6:
nvm install v4.2.3
nvm alias default v4.2.3
npm install react-native-cli@0.1.10 -g
然后是 imoocApp 项目本身的版本,是通过 react-native-cli 来初始化的,初始化的时候,不要执行 sudo,初始化以后以后的 react 和 react-native 版本应该跟下面的保持一致,其他的是后面课程安装的版本先不管:
"lodash": "^4.13.1",
"mockjs": "^1.0.0",
"query-string": "^4.2.0",
"react": "^0.14.8",
"react-native": "^0.22.2",
"react-native-audio": "^1.2.1",
"react-native-button": "^1.6.0",
"react-native-cli": "^0.2.0",
"react-native-image-picker": "^0.20.0",
"react-native-progress": "^3.0.1",
"react-native-sk-countdown": "^1.0.1",
"react-native-swiper": "^1.4.6",
"react-native-vector-icons": "^2.0.2",
"react-native-video": "^0.8.0",
"sha1": "^1.1.1"
以上全部保持一致后,我们来看下 info.plist,参考下我下面的:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>CFBundleDevelopmentRegion</key>
<string>en</string>
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
<string>$(PRODUCT_NAME)</string>
<key>CFBundlePackageType</key>
<string>APPL</string>
<key>CFBundleShortVersionString</key>
<string>1.0</string>
<key>CFBundleSignature</key>
<string>????</string>
<key>CFBundleVersion</key>
<string>1</string>
<key>LSRequiresIPhoneOS</key>
<true/>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiredDeviceCapabilities</key>
<array>
<string>armv7</string>
</array>
<key>UISupportedInterfaceOrientations</key>
<array>
<string>UIInterfaceOrientationPortrait</string>
<string>UIInterfaceOrientationLandscapeLeft</string>
<string>UIInterfaceOrientationLandscapeRight</string>
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>NSLocationWhenInUseUsageDescription</key>
<string/>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
<key>NSExceptionDomains</key>
<dict>
<key>localhost</key>
<dict>
<key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
<true/>
</dict>
</dict>
</dict>
</dict>
</plist>
然后比对下跟我的 ios/AppDelegate.m 的代码一致性:
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
#import "AppDelegate.h"
#import "RCTRootView.h"
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation;
/**
* Loading JavaScript code - uncomment the one you want.
*
* OPTION 1
* Load from development server. Start the server from the repository root:
*
* $ npm start
*
* To run on device, change `localhost` to the IP address of your computer
* (you can get this by typing `ifconfig` into the terminal and selecting the
* `inet` value under `en0:`) and make sure your computer and iOS device are
* on the same Wi-Fi network.
*/
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. The static bundle is automatically
* generated by the "Bundle React Native code and images" build step when
* running the project on an actual device or running the project on the
* simulator in the "Release" build configuration.
*/
// jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"imoocApp"
initialProperties:nil
launchOptions:launchOptions];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIViewController *rootViewController = [UIViewController new];
rootViewController.view = rootView;
self.window.rootViewController = rootViewController;
[self.window makeKeyAndVisible];
return YES;
}
@end
然后来这里,排除下这里的环境问题:
http://facebook.github.io/react-native/releases/0.22/docs/troubleshooting.html#content
以上全部搞定无误后,还是跑不通,可以把你的代码完整打包发到 564318110 群共享里,再来看看是咋回事。
在初期,很多问题都是由于环境问题导致的,要小心应对