react-native 项目开发问题

1.安装依赖 注意：不要使用cnpm！cnpm安装的模块路径比较奇怪，packager不能正常识别！ 可以用官网描述的yarn

2.Android真机调试 大力晃动手机 弹出菜单

3.Unable to load script from assets index.android.bundle...

链接 www.jianshu.com/p/a6f97bdc0…

4.Module HMRClient is not a registered callable module (calling enable)

终端执行 adb reverse tcp:8081 tcp:8081

5.Runtime is not ready for debugging

重启Chrome 后 cmd + r

6.

模拟器 restart

7.修改react-native 端口号

一 、 启动react native服务的时候可以为它指定一个端口号： react-native start --port=8082；

二、 永久修改Server端口

要永久修改这个默认端口号，我们需要修改server.js文件，server.js所在位置，在：

你的项目名称/node_modules/react-native/local-cli/server/server.js

8.Unable to load script from assets index.android.bundle...

a. 项目根目录下 android/app/src/main/assets 新建文件夹assets {Mac 命令 mkdir android/app/src/main/assets }

b. 项目根目录下执行命令 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

如图显示成功

c.重启项目 react-native run-ios

9.签名打包 ./gradlew assembleRelease --stacktrace 出现

:app:processReleaseResources FAILED

FAILURE: Build failed with an exception.

• What went wrong:

Execution failed for task ':app:processReleaseResources'.

com.android.ide.common.process.ProcessException: Failed to execute aapt

10.android 打包 问题： app processReleaseResources FAILED

/home/mahesh/projects/gitlab/test/android/app/build/intermediates/res/merged/release/drawable-mdpi/src_images_loader.gif: error: Duplicate file./home/mahesh/projects/gitlab/test/android/app/build/intermediates/res/merged/release/drawable-mdpi-v4/src_images_loader.gif: Original is here. The version qualifier may be implied.

运行命令 ./gradlew assembleRelease --stacktrace 查看具体错误信息

解决方案 在node_modules/react-native/react.gradle def currentBundleTask = tasks.create 方法中最后添加

doLast {
    def moveFunc = { resSuffix ->
    File originalDir = file("${resourcesDir}/drawable-${resSuffix}")
    if (originalDir.exists()) {
        File destDir = file("${resourcesDir}/drawable-${resSuffix}-v4")
        ant.move(file: originalDir, tofile: destDir)
    }
    }
    moveFunc.curry("ldpi").call()
    moveFunc.curry("mdpi").call()
    moveFunc.curry("hdpi").call()
    moveFunc.curry("xhdpi").call()
    moveFunc.curry("xxhdpi").call()
    moveFunc.curry("xxxhdpi").call()
}
复制代码

在 node_modules/react-native/local-cli/bundle/assetPathUtils.js这个文件里面getAndroidAssetSuffix方法改为

function getAndroidAssetSuffix(scale) {
  switch (scale) {
    case 0.75: return 'ldpi-v4';
    case 1: return 'mdpi-v4';
    case 1.5: return 'hdpi-v4';
    case 2: return 'xhdpi-v4';
    case 3: return 'xxhdpi-v4';
    case 4: return 'xxxhdpi-v4';
  }
}
复制代码

11.Cannot read property 'Aspect' of undefined

检查连接了 camera 没有 执行 react-native link react-native-camera

添加Android权限 在android/app/src/main/AndroidManifest.xml文件中添加

然后设置静态存储文件 assets 见上面8问题

再 react-native run-ios

12.xcode 运行ios 真机调试 build successed 后真机无响应

退出xcode 关闭8081终端 重启xcode 项目

13 ios 真机调试 跨域资源加载出错

跨域资源加载出错 解决方法：替换主机名

将localhost替换成192.168.3.126.xip.io，即通过http://192.168.3.126.xip.io:8081/debugger-ui/ 来访问调试界面。 reload；

14 iOS的app运行时不满屏，上下留有黑边的解决办法

启动图问题 lanuchImage 的图片集中 需含有640960 和 9601136尺寸的PNG图片 分别放置ios 7+

转载于:https://juejin.im/post/5c0f706351882511a852c012