1.
Application NaticeHybrid has not been registered.This is either due to a require() error during initialization or failure to call AppRegistry.registerComponent.
AppRegistry.registerComponent('RnTestProject', () => HelloWorld);
Activity里getMainComponentName的return返回值要和RN注册值"RnTestProject"保持一致
2.
Caused by: java.lang.UnsatisfiedLinkError: could find DSO to load: libreactnativejni.so
Android不能同时加载32和64位本机库。 如果您至少有一个依赖库使用ARM64支持编译的扩展,而另外一些依赖库仅支持ARM32,就会出现问题。 系统将检测ARM64依赖关系,加载它,然后拒绝加载仅ARM32的so库,就可能导致应用程序崩溃。
需要修改app的build.gradle,将ndk,packagingOptions配置一下
defaultConfig {
applicationId "com.ghp.rn.rntestproject"
minSdkVersion 19
targetSdkVersion 25
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
ndk{
abiFilters "armeabi-v7a","x86"
}
packagingOptions {
exclude "lib/arm64-v8a/libimagepipeline.so"
}
}
3.
在原生应用调转到RN页面的时候,会出现大概1s的白屏现象.
解决方法:把创建ReactRootView以及获取jsbundle的操作放入到Native代码中,比如放置到启动页或者跳转到RN界面的前一个页面等等.总之保证打开的时候已经缓存OK
待测试!
4.
Brownfield | Stetho | “:com.facebook.stetho:stetho-okhttp:1.2.0' depends on one or more Android Libraries but is a jar”
Add to dependencies:
compile ("com.facebook.react:react-native:+") {
exclude group:'com.facebook.stetho', module:'stetho'
}
5.
can’t find \node_modules\react-native\local-cli\cli.js
重新npm install,把缺少的东西安装上
6.
Could not find property’JIMU_RELEASE_STORE_FILE’* on SigningConfig_Decorated{name=release, storeFile=null, storePassword=null, keyAlias=null, keyPassword=null, storeType=null}.
删除掉android/app/build.gradle 里的:
storeFile file(MYAPP_RELEASE_STORE_FILE)
storePassword MYAPP_RELEASE_STORE_PASSWORD
keyAlias MYAPP_RELEASE_KEY_ALIAS
keyPassword MYAPP_RELEASE_KEY_PASSWORD
7.
“npm notice created a lockfile as package-lock.json. You should commit this file.” How to commit it?
git add --all, git commit -m "commit" 忽略过
8.
Exception in native call from JS
java.lang.RuntimeException: ReferenceError: Can’t find variable: __fbBatchedBridge
这个纠结了很久
在package.json里配置
"bundle-android":
"react-native bundle --platform android --dev false --entry-file index.android.js
--bundle-output android/RnTestProject/app/src/main/assets/index.android.bundle
--sourcemap-output
android/RnTestProject/app/src/main/assets/index.android.map
--assets-dest
android/RnTestProject/app/src/main/res/"
需要注意:
- 路径需要和自己项目的路径一致。
- 有的是 index.android.js,看看自己创建的是不是这个名字,还是 index.js。
- 没有assets文件夹,需要手动创建一下,搜索有说index.android.bundle也需要手动先创建。
- activity里创建的
ReactRootView?.startReactApplication(mReactInstanceManager, "RnTestProject", null)
第二个参数moduleName需要合RN注册的值"RnTestProject"保持一致。
- 在项目的 build.gradle 文件中为 React Native 添加一个 maven 依赖的入口,必须写在 "allprojects" 代码块中:
allprojects {
repositories {
...
maven {
// All of React Native (JS, Android binaries) is installed from npm
url "$rootDir/../node_modules/react-native/android"
}
}
...
}
确保依赖路径的正确!以免在 Android Studio 运行Gradle同步构建时抛出 “Failed to resolve: com.facebook.react:react-native:0.x.x" 异常。
node_modules已经在根目录的话,需要去除../
当项目和node_modules不在一起的时候可以使用绝对路径 。
执行完之后,查看手机或者模拟器是否和你的RN服务端在同一个局域网内
在执行 npm run bundle-android 时,可能会报IP问题,按着提示 kill -9 ip值,然后 npm start,studio build
发现执行完,index.android.bundle里没有内容,APP运行起来打开依然奔溃,依然提示该错误
curl "http://localhost:8081/index.android.bundle?platform=android"
-o "android/RnTestProject/app/src/main/assets/index.android.bundle"
执行这句index.android.bundle依然没有内容的话,直接打开http://localhost:8081/index.android.bundle?platform=android,
将获取到的内容复制到index.android.bundle里
然后继续重新运行
9.
修改js文件,reload之后没效果:
要解决办法,修改MAX WAIT_TIME变量,项目路径
/node_modules/react-native/packager/react-packager/src/node-haste/FileWatcher/index.js
中的MAX WAIT_TIME值改得更大一些;
const MAX_WAIT_TIME = 120000;
const MAX_WAIT_TIME = 360000; //改大一些以便node服务可以将js的修改打包到bundle文件中。
找到如下代码
key: '_createWatcher',
value: function _createWatcher(rootConfig) {
var watcher = new WatcherClass(rootConfig.dir, {
glob: rootConfig.globs,
dot: false
});
return new Promise(function (resolve, reject) {
var rejectTimeout = setTimeout(function () {
return reject(new Error(timeoutMessage(WatcherClass)));
}, MAX_WAIT_TIME);
watcher.once('ready', function () {
clearTimeout(rejectTimeout);
resolve(watcher);
});
});
}
//修改为
key: '_createWatcher',
value: function _createWatcher(rootConfig) {
var watcher = new WatcherClass(rootConfig.dir, {
glob: rootConfig.globs,
dot: false
});
return new Promise(function (resolve, reject) {
const rejectTimeout = setTimeout(function() {
reject(new Error([
'Watcher took too long to load',
'Try running `watchman version` from your terminal',
'https://facebook.github.io/watchman/docs/troubleshooting.html',
].join('\n')));
}, MAX_WAIT_TIME);
watcher.once('ready', function () {
clearTimeout(rejectTimeout);
resolve(watcher);
});
});
}
修改和之后要重启React Packager。
最新的RN已经没有这个这个问题了,只要你启动hot loading,修改js后就会自动加载。
10.
The development server returned response error code: 500 in react-native
tries to require 'react-native',
but there are several files providing this module.
You can delete or fix them: ……
找到多余的files,删除后报这个:
Unable to resolve module `react/lib/ReactComponentWithPureRenderMixin` from `/Users/song/Desktop/ReactNativeRouterFlux/node_module s/react-native-experimental-navigation/node_modules/react-addons-pure-render-mixin/index.js`: Module does not exist in the module map or in these directories:
类似这种错误,就是缺少模块,通过
npm i react-addons-pure-render-mixin -S
命令即可,标记部分是你缺少的模块名。
如果还不行的话,就把node_modules删除,再重新建立
11.
undefined is not an object(evaluating 'HotUpdate.downloadRootDir')
需要在getPackages方法中添加new UpdatePackage();
rn0.29后在Mainapplication中,rn0.29前在MainActivity中:
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new UpdatePackage()
);
}
记得导包:
import cn.reactnative.modules.update.UpdatePackage;
12.
Error: Cannot find module 'metro-bundler/src/babelRegisterOnly'
at Function.Module._resolveFilename (module.js:469:15)
at Function.Module._load (module.js:417:25)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/Users/ghp/c_work/RN/AwesomeProject/node_modules/react-native-update/local-cli/lib/bundle.js:439:9)
at next (native)
at step (/Users/ghp/c_work/RN/AwesomeProject/node_modules/react-native-update/local-cli/lib/bundle.js:310:191)
at /Users/ghp/c_work/RN/AwesomeProject/node_modules/react-native-update/local-cli/lib/bundle.js:310:361
将node_modules\react-native-update\local-cli\lib\bundle.js的439行种的metro-bundler改成metro可成功运行;
13.
unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or youu’re runing a packager server
In project directory,
* `mkdir android/app/src/main/assets`
* `react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res`
* `react-native run-android`
14.
uncaughtException:couldn't find DSO to load: libreactnativejni.so
修改app的build.gradle:
defaultConfig {
...
minSdkVersion 16
...
ndk{
abiFilters "armeabi-v7a","x86"
}
packagingOptions {
exclude "lib/arm64-v8a/libimagepipeline.so"
}
}
15.
uncaughtException:Unable to load script from assets 'index.android.bundle'.
Make sure your bundle is packaged correctly or you're running a packager server.
reload之后,变为
Could not connect to development server
看是否启动 npm start,adb是否连接,WiFi是否连接同一个IP,
我是Dev Setting设置IP重启OK的,如图:
16. Can't find variable: CodePush
原先demo添加了热更新的逻辑,现在将项目迁移至Android目录夹,实现Android原生页面跳转RN页面,index.js在registerComponent时设置了CodePush,去掉后页面正常打开,热更新如何修改待定
17.
按照官网文档集成到现有原生应用,需要自建ReactRootView,其实ReactActivity已经帮我们做了这些,新建activity直接继承ReactActivity就可以。
ReactInstanceManager.builder()
.setApplication(application)
.setBundleAssetName("index.android.bundle")
.setJSMainModulePath("index")
...
在自建ReactRootView时,查看RN源码会发现assets取的路径在assets文件夹,需要在main目录下创建assets文件夹,生成index.android.bundle文件,index.android.map是标识文件,可以不用
在assets文件夹生成index.android.bundle文件,将bundles里的该文件复制过来也可以:
react-native bundle --entry-file index.js --bundle-output
./android/app/src/main/assets/index.android.bundle --platform android
--assets-dest ./android/app/src/main/res/ --dev false
18
console.error:"React Native version mismatch.
JavaScript version:0.54.4
Native version:0.55.3
..."
这个问题需要指定下版本,有2种修改方式:
(参考https://github.com/facebook/react-native/issues/19259)
第一种将app/build.gradle修改
//compile "com.facebook.react:react-native:+" // From node_modules
compile ("com.facebook.react:react-native:0.55.3") { force = true }// From node_modules
第二种在根目录的build.gradle修改
allprojects {
repositories {
...
}
// 版本 指定
configurations.all {
resolutionStrategy {
eachDependency { DependencyResolveDetails details ->
if (details.requested.group == 'com.facebook.react' && details.requested.name == 'react-native') {
details.useVersion "0.55.3" //你当前react native 版本
}
}
}
}
}