1、新建bundle

在自己项目的ios文件夹下新建一个文件夹取名bundle

PS:ios文件夹和node_modules文件夹在同一级目录下,这个bundle文件夹名称随意取,后面要用到,但是记得在相应地方改一下就好了

2、修改package.json

//scripts 内加入
"bundle-ios": "node node_modules/react-native/local-cli/cli.js bundle --entry-file index.js --platform ios --dev false --bundle-output ./ios/bundle/index.ios.jsbundle --assets-dest ./ios/bundle" //参数说明:

  --entry-file 指定入口文件 因为要打包ios平台,所以指定为rn项目的index.ios.js作为入口

  --bundle-output 指定输出的jsbundle文件路径和文件名 指定到rn项目的ios工程文件夹下,记得一定要先创建bundle文件夹,不然终端会报文件夹找不到的错误

  --platform 指定平台类型

  --assets-dest 指定资源文件夹路径 assets文件夹的路径,包含图片、node模块等资源

  --dev 是否为开发模式 如果设置为false,不会产生警告,并且bundle会被压缩

3、修改根目录 ./ios/项目名称/AppDelegate.m

  //电脑模拟器执行
// jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; //打包至真机执行
//jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"index.ios" withExtension:@"jsbundle"];

4、编译

修改后执行 npm run bundle-ios,执行成功后会在新建的 bundle 内打包 index.ios.jsbundle 文件 如下图

5、用Xcode打开项目文件

拖入index.ios.jsbundle 文件选择create folder references

6、打包至手机

手机连接电脑(mac) 选择连接的手机  run 完美 !

遇到的问题

1、ReactNative出现错误问题'React/RCTAssert.h' file not found

https://www.cnblogs.com/shihao905/p/9296367.html

2、Signing for "rnDemoTests" requires a development team. Select a development

重新配置开发者账号,由自动配置改为手动配置

3、code signing is required for product type 'xxxxx' in SDK 'iOS 11.4'

2问题配置好没有这个问题

react native 打包至iphone设备的更多相关文章

  1. [React Native] Target both iPhone and iPad with React Native

    By default, React Native only targets iPhone - so if you run on an iPad, it will show up as a scaled ...

  2. [RN] React Native 打包时 减少 Apk 的大小

    React Native 打包时 减少 Apk 的大小 主要有两个方法: 在打包前设置 android\app\build.gradle 文件中 1) def enableProguardInRele ...

  3. React Native 打包.jsx文件

    最近在研究React Native.感觉开发效率确实不错,但jsx语法写起来感觉不怎么顺手. 试用了Sublime Text 3和Visual Studio Code写代码,感觉反应总是慢一拍. 还是 ...

  4. React Native适配IPhoneX系列设备之<SafeAreaView />

    SafeAreaView的目的是在一个“安全”的可视区域内渲染内容.具体来说就是因为目前有 iPhone X 这样的带有“刘海”的全面屏设备,所以需要避免内容渲染到不可见的“刘海”范围内.本组件目前仅 ...

  5. react native 打包Ignoring return value of function declared with warn_unused_result attribute

    从 github上下载 项目 用于学习查看别人的代码, 当执行完npm install  用xcode 打开 发现俩个错误提示Ignoring return value of function dec ...

  6. React Native 打包 Apk

    第一步:生成秘钥库 keytool -genkey -v -keystore opsmart-android-release-key.keystore -alias opsmart-android - ...

  7. react native 打包上架

    https://www.jianshu.com/p/ce71b4a8a246 react-native bundle --entry-file index.ios.js --platform ios ...

  8. React Native专题

    转载注明出处:地址:http://www.lcode.org本文出自:[江清清的技术专栏]本React Native讲解专题:主要讲解了React Native开发,由基础环境搭建配置入门,基础,进阶 ...

  9. React Native专题-江清清

    本React Native讲解专题:主要讲解了React Native开发,由基础环境搭建配置入门,基础,进阶相关讲解. 刚创建的React Native交流8群:533435865  欢迎各位大牛, ...

随机推荐

  1. loj6038「雅礼集训 2017 Day5」远行 树的直径+并查集+LCT

    题目传送门 https://loj.ac/problem/6038 题解 根据树的直径的两个性质: 距离树上一个点最远的点一定是任意一条直径的一个端点. 两个联通块的并的直径是各自的联通块的两条直径的 ...

  2. 解决安装mysql-connector-odbc-5.3.2 错误1918……不能加载安装或转换器库……的BUG

    还是在虚拟机Windows Server 2003上安装mysql-connector-odbc-5.3.2,装着装着就报错了,大致是“错误1918……不能加载安装或转换器库……”,问我Retry,I ...

  3. ssh服务配置

    ------------------------------------------ ssh 服务安装ssh  apt-get install openssh-server启动 service ssh ...

  4. animation transition transform

    animation:动画名称 花费时间 运动曲线 何时开始 播放次数 是否反方向 div{width:100px;height:100px;background:red;animation:move ...

  5. 检查电脑链接的网络是否支持ipv6

    测试方法一:在浏览器地址栏输入网址“http://test-ipv6.com/”,在页面会给出您的ipv6网络测试结果 测试方法二:在浏览器地址栏输入网址“http://ipv6.jmu.edu.cn ...

  6. luogu P1449 后缀表达式 x

    题目描述 所谓后缀表达式是指这样的一个表达式:式中不再引用括号,运算符号放在两个运算对象之后,所有计算按运算符号出现的顺序,严格地由左而右新进行(不用考虑运算符的优先级). 如:3*(5–2)+7对应 ...

  7. UX168办公本地环境维护记录

    上班到公司 1.打考勤靠.或处理考勤异常 2.钉钉 3.邮件. 4.禅道系统 5.开启nginx.node.monogo服务 5.1.开启nginx服务 /etc/init.d/apache2 sto ...

  8. 【HDOJ6667】Roundgod and Milk Tea(模拟)

    题意:有n个班级,每个班级有a[i]个人,b[i]杯奶茶 每个人至多喝一杯奶茶,且不能喝自己班的 问能喝到奶茶的最多总人数 n<=1e6,a[i],b[i]<=1e9 思路: 做法一: # ...

  9. mybatis获取数据库自增id

    http://blog.csdn.net/dyllove98/article/details/8866357 http://www.iteye.com/problems/86864 insert标签中 ...

  10. HTML5 新属性的讲解

    1.选择器: 标签选择器: class选择器: id选择器: 后代选择器:div li div下所有li 子代选择器:div>li div的所有子一代 li 元素 交集选择器:div.class ...