react-native 开发坑记录

本贴最后更新于 2634 天前,其中的信息可能已经东海扬尘
  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>
    
  • React

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    192 引用 • 291 回帖 • 384 关注
  • 一些有用的避坑指南。

    69 引用 • 93 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...

推荐标签 标签

  • 国际化

    i18n(其来源是英文单词 internationalization 的首末字符 i 和 n,18 为中间的字符数)是“国际化”的简称。对程序来说,国际化是指在不修改代码的情况下,能根据不同语言及地区显示相应的界面。

    8 引用 • 26 回帖
  • 一些有用的避坑指南。

    69 引用 • 93 回帖
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 10 关注
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 156 关注
  • gRpc
    11 引用 • 9 回帖 • 72 关注
  • Ubuntu

    Ubuntu(友帮拓、优般图、乌班图)是一个以桌面应用为主的 Linux 操作系统,其名称来自非洲南部祖鲁语或豪萨语的“ubuntu”一词,意思是“人性”、“我的存在是因为大家的存在”,是非洲传统的一种价值观,类似华人社会的“仁爱”思想。Ubuntu 的目标在于为一般用户提供一个最新的、同时又相当稳定的主要由自由软件构建而成的操作系统。

    125 引用 • 169 回帖
  • Sillot

    Insights(注意当前设置 master 为默认分支)

    汐洛彖夲肜矩阵(Sillot T☳Converbenk Matrix),致力于服务智慧新彖乄,具有彖乄驱动、极致优雅、开发者友好的特点。其中汐洛绞架(Sillot-Gibbet)基于自思源笔记(siyuan-note),前身是思源笔记汐洛版(更早是思源笔记汐洛分支),是智慧新录乄终端(多端融合,移动端优先)。

    主仓库地址:Hi-Windom/Sillot

    文档地址:sillot.db.sc.cn

    注意事项:

    1. ⚠️ 汐洛仍在早期开发阶段,尚不稳定
    2. ⚠️ 汐洛并非面向普通用户设计,使用前请了解风险
    3. ⚠️ 汐洛绞架基于思源笔记,开发者尽最大努力与思源笔记保持兼容,但无法实现 100% 兼容
    29 引用 • 25 回帖 • 85 关注
  • 服务器

    服务器,也称伺服器,是提供计算服务的设备。由于服务器需要响应服务请求,并进行处理,因此一般来说服务器应具备承担服务并且保障服务的能力。

    125 引用 • 588 回帖
  • 自由行
    11 关注
  • Kafka

    Kafka 是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据。 这种动作(网页浏览,搜索和其他用户的行动)是现代系统中许多功能的基础。 这些数据通常是由于吞吐量的要求而通过处理日志和日志聚合来解决。

    36 引用 • 35 回帖 • 2 关注
  • Quicker

    Quicker 您的指尖工具箱!操作更少,收获更多!

    32 引用 • 136 回帖 • 2 关注
  • ngrok

    ngrok 是一个反向代理,通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 624 关注
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖
  • RESTful

    一种软件架构设计风格而不是标准,提供了一组设计原则和约束条件,主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓存等机制。

    30 引用 • 114 回帖 • 1 关注
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。

    55 引用 • 85 回帖
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug(漏洞)。

    75 引用 • 1737 回帖 • 1 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。

    27 引用 • 225 回帖 • 168 关注
  • 音乐

    你听到信仰的声音了么?

    60 引用 • 511 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 609 关注
  • FFmpeg

    FFmpeg 是一套可以用来记录、转换数字音频、视频,并能将其转化为流的开源计算机程序。

    23 引用 • 32 回帖
  • Dubbo

    Dubbo 是一个分布式服务框架,致力于提供高性能和透明化的 RPC 远程服务调用方案,是 [阿里巴巴] SOA 服务化治理方案的核心框架,每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持,并被广泛应用于阿里巴巴集团的各成员站点。

    60 引用 • 82 回帖 • 597 关注
  • 链书

    链书(Chainbook)是 B3log 开源社区提供的区块链纸质书交易平台,通过 B3T 实现共享激励与价值链。可将你的闲置书籍上架到链书,我们共同构建这个全新的交易平台,让闲置书籍继续发挥它的价值。

    链书社

    链书目前已经下线,也许以后还有计划重制上线。

    14 引用 • 257 回帖 • 1 关注
  • 房星科技

    房星网,我们不和没有钱的程序员谈理想,我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源,遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。

    6 引用 • 141 回帖 • 585 关注
  • Notion

    Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.

    6 引用 • 38 回帖
  • danl
    133 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具,助力您的学习与思考,让您的大脑更高效的记忆。

    笔记整理交给我,一心只读圣贤书。

    1 引用 • 1 回帖
  • 安全

    安全永远都不是一个小问题。

    199 引用 • 816 回帖