react-native 开发坑记录 有更新!

  |   0 评论   |   459 浏览

    1. 环境搭建,根据官网,其中的building projects with native code tab 下的步骤依次配置。这里有个问题,ANDROID_HOME必须配置。

      export ANDROID_HOME=$HOME/Library/Android/sdk
      
    2. 华为手机打开 demo app之后,自动跳转到在其他应用的上层显示,蛋疼的东西,找到自己的 app,然后设置允许,重新进入

    3. RN 结构的基本介绍,戳这里
    4. 文件路径找不到的问题,摇一下手机,然后出现setting列表,选 dev settings,修改 debug server host & port for device,改成你的电脑的ip:8081。返回之后再摇一下,reload。也可以退出后重启。
    5. 如果是 # [SyntaxError: Strict mode does not allow function declarations in a lexically nested statement on a newly created app](https://stackoverflow.com/questions/41058495/syntaxerror-strict-mode-does-not-allow-function-declarations-in-a-lexically-nes)
      open node_modules\react-native\Libraries\Core\InitializeCore.js line 112
      
      change function Const handleError = (e, isFatal) =>  to var handleError = function(e, isFatal)
      
      then do npm start -- --reset-cache
      

      这里可能也跟 react native 的版本有关系,版本比较低一点的,目录结构可能不是这样的=>node_modules\react-native\Libraries\Core
      具体的多少版本之后,不清楚。。。

    6. 然后就启动了。但是,用一个Redmi note 3测试,依旧报错。如下:
      Installing APK 'app-debug.apk' on 'Redmi Note 3 - 5.0.2' for app:debug
      
      08:38:06 E/234205030: Error while uploading app-debug.apk : Unknown failure ([CDS]close[0])
      

      可以参考这里. 给出了三种解决方案,第二种和第三种都试过了。貌似可以解决问题。
      附:查看设备 id 的方式: adb devices

    7. 然后出现一个新的问题,启动app 后是白屏的。看日志,显示

      Could not run adb reverse: Command failed: xxx adb reverse tcp:8081 tcp:8081
      然后就不知道为啥了。。感觉跟手机系统版本有关,我用的 android 5.0,华为的7.0是没啥问题了的。这里暂时没找到原因,现这样吧。

    8. deviceinfo native module is not installed correctly
      在启动一个新的 app demo 的时候,已有一个 local server 启动着,需要关了,重新在安装对应的 app 之前启动 server。
    9. # [StackNavigator报错back-icon.png:Unexpected character解决方法](http://www.cnblogs.com/douglasvegas/p/6978468.html)
      关闭模拟器关闭server,执行
      react-native link,再重新npm start即可。

    10. navigation/router 相关的,采用了React Navigation组件。不管是drawerLayout/tabView/stackView还是这几种组合,实现起来还是都比较容易的。

      以上组合方式的使用可以参考这篇文章

    11. 对于refreshableList的使用,可以参考 npm 包react-native-refresh-list-viewgithub地址,这个实现比较简单,非常轻量,还算好用。

      我目前没有footer加载相关的需求,这个小组件扩展性还是不够,所以就down了源码放到项目里,把不需要的部分给注释掉了。后面看看可以提个pr增强下扩展性什么的。

    12. xxxx as a folder: it did not contain a package, nor an index file

      个人理解,这个问题通常是xxxx文件命名的问题,我自己遇到这个问题是因为:export default tabNews,而文件名是 tabnews。。就报错了。

    13. react native module HMRClient is not registered
      这个问题,刷新之后又变成了 404, 不知道咋滴,不过看来是 ip 没设置对。因为前面卸载过,添加ip后好了。真的是坑巨多,而且提示的错误,完全看不出原因。

    14. the title prop of a button must be a string - react native
      button name 应该以 title 属性的形式放在 Button 里

      <Button onPress={() => {
        this._setModalVisible(true)
      }}
      title="Show Modal">
      <Button>
      

    评论

    发表评论

    validate