文档章节

ReactNative 踩坑(1)环境搭建 Unable to download JS bundle

叫我爷_好吗
 叫我爷_好吗
发布于 2016/03/02 11:33
字数 531
阅读 1212
收藏 1

目前我遇到出现在Unable to download JS bundle   的情况有两种

  1. 在android真机测试时 app 出现server 访问错误,在因为在测试模式中app需要访问开发机上的server服务进行加载js文件


             解决方法:如果是android 5.0设备 可以使用USB方式访问,在测试手机与开发机用USB线连接时 运行以下命令然后在app界中摇晃手机或按菜单键,在开发菜单中选择 Dev Setting  ->  Debug server host & port for device  然后填上 127.0.0.1:8081

    $ adb reverse tcp:8081 tcp:8081


             如果是 5.0以下设备请将开发机与测试手连接到同一网络,然后在app界中摇晃手机或按菜单键,在开发菜单中选择 Dev Setting  ->  Debug server host & port for device  然后把你的开发机IP地址和server 端口填上 端口默认是8081(例:192.168.1.100:8081)


  2. 一般情况在开发机中访问 localhost:8081/index.android.bundle?platform=android 会打印出你要加载的JS代码          
    但现在他会显示出跟下面类似的错误代码
             {"message":"TransformError: /Users/Zachary/Desktop/Android Work/Recat/MyProject/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/Zachary/Desktop/Android Work/Recat/MyProject/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/Zachary/Desktop/Android Work/Recat/MyProject/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/.babelrc.stage","type":"TransformError","errors":[{}]}                    

                这个情况在app中我见过有两中不同的错误显示方式。。           

                第一个就是显示Unable to download JS bundle

                第二个显示为 The development server returned response error code:500    

                  

                无疑第二个才是这个错误最正确的打开方式,但我不明白为什么会有显示第一种的情况                     

      为什么会出现这种错误呢?          
      原因是:在新版本在升级了使用 Bable6 ,可以有些依赖的库不是使用这个版本所以会出现这个错误。所以要把这个 bable 删除,升级依赖          

                1,先删除依赖包:
                   rm -rf node_modules
                   npm install
                2,修改package.json文件
                   "scripts": {
                   "clean:babelrc": "find ./node_modules -name react-packager -prune -o -name '.babelrc' -print | xargs rm -f","postinstall": "npm run clean:babelrc"

                    }

© 著作权归作者所有

共有 人打赏支持
叫我爷_好吗
粉丝 7
博文 1
码字总数 531
作品 1
广州
程序员
已有Android项目集成RN

开篇一张图,后面全靠编 1.配置ReactNative的js环境 在Android项目根目录下输入命令npm init (直接在Android studio的terminal命令窗口就行) 我们可以看到init让你生成一个package.json文件,...

pjenary
07/19
0
0
React Native跨平台移动应用开发框架介绍

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/m366917/article/details/61423043 好久没有来更新博客了,给大家说声抱歉,人一旦懒惰起来连自己都害怕。可能...

Aduroidpc
2017/03/11
0
0
学习RN之前看这一篇React入门就够了

React是一个用于构建用户界面的 JavaScript 库,起源于Facebook内部项目,13年已经开源https://github.com/facebook/react。学习ReactNative首先要了解React相关的知识(当然可以和RN同步学习...

LvesLi
06/29
0
0
Udacity也弃用React Native了 !看看他们使用React Native过程中遇到了哪些问题

Udacity也弃用React Native了 !看看他们使用React Native过程中遇到了哪些问题 2018-07-12 10:29编辑: 枣泥布丁分类:程序人生来源:程序师 React Native弃用Udacity 招聘信息: iOS开发 ...

枣泥布丁
07/12
0
0
手把手教你React Native实战从 React到Rn《二》

了解相关更多技术,可参考《学习React Native必看的几个开源项目》,接下来 我们来聊一聊相关的React。 React简介 Rn是基于React的设计,了解 React有助于我们开发RN应用,React希望将功能分...

codeGoogle
06/01
0
0

没有更多内容

加载失败,请刷新页面

加载更多

主流的消息队列MQ比较,详解MQ的4类应用场景

目前主流的MQ 1.ZeroMQ 号称最快的消息队列系统,尤其针对大吞吐量的需求场景。 扩展性好,开发比较灵活,采用C语言实现,实际上只是一个socket库的重新封装,如果做为消息队列使用,需要开发...

游人未归
40分钟前
1
0
React 服务器渲染原理解析与实践

网盘下载地址 React 服务器渲染原理解析与实践 本套课程,讲解了React中SSR技术的整个搭建思路及流程,完整的从原理上讲清楚了SSR的概念,重点在于讲解编写SSR框架遇到的各种知识点,以及细节...

qq__2304636824
今天
2
0
Jenkins使用

clean install -Dmaven.test.skip=true

1713716445
今天
1
0
多线程

1. 多线程概念。并发和并行的概念。 多线程指的是一段时间内cpu同时执行多个线程。一个程序至少运行>=1个进程,进程就是运行中的程序,而一个进程至少运行>=1个线程,线程是操作系统能调度的...

鱼想吃肉
今天
3
0
HBase 表修复在线方式和离线方式

一、在线修复 1.1 使用检查命令 $ ./bin/hbase hbck 该命令可完整修复 HBase 元数据信息;存在有错误信息会进行输出; 也可以通过如下命令查看详细信息: $ ./bin/hbase hbck -details 1.2 ...

Ryan-瑞恩
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部