文章目录
- 一、前言
- 二、问题分析
- 三、走近 main.jsbundle
一、前言
rn项目热部署时iphone设备弹出如下错误弹窗:No bundle URL present
遇到以上问题,需要手动生成ios下的main.jsbundle
文件。但是使用另一台MacBook Pro 就没有类似问题。
二、问题分析
网上给出的解决方法:生成main.jsbundle
文件,在终端项目目录下执行:
react-native bundle --dev true --entry-file index.js --bundle-output ios/main.jsbundle --platform ios --assets-dest ./ios
或在 package.json
里面添加以下执行命令,终端执行yarn buildios即可生成main.jsbundle
文件:
"buildios":"react-native bundle --entry-file='index.js' --bundle-output='./ios/main.jsbundle' --dev=false --platform='ios'"
2、然后在TARGES
找到这里并添加,然后重新打包就可以了
实际执行阶段,遇到如下错误:
Loading dependency graph...Failed to construct transformer: Error: Cannot create a string longer than 0x1fffffe8 characters
出现以上问题是由于watchman
缺失导致,需安装下watchman
brew install watchman
brew install gcc
由于资源有限,watchman
安装过程比较曲折耗时,请耐心等待⌛️
安装成功后,重新生成main.jsbundle
文件
react-native bundle --dev true --entry-file index.js --bundle-output ios/main.jsbundle --platform ios --assets-dest ./ios
三、走近 main.jsbundle
在React Native中使用main.jsbundle
构建和运行发布是一种优化应用性能和减少包大小的方法。
在React Native中,main.jsbundle
是一个包含所有JavaScript
代码的文件。它是通过将所有的JavaScript
代码打包成一个文件来实现的,以便在应用运行时加载和执行。
main.jsbundle
属于React Native应用构建和发布方案中的一种。它是一种静态资源文件,用于存储React Native应用的JavaScript
代码。
使用main.jsbundle
构建和运行发布方案有以下优势:
- 减少包大小:将所有的
JavaScript
代码打包成一个文件可以减少应用的包大小,从而提高应用的加载速度和性能。 - 加快应用启动时间:由于只需要加载一个文件,而不是多个文件,因此应用的启动时间会更快。
- 提高应用的安全性:将
JavaScript
代码打包成一个文件可以减少代码被篡改的风险,提高应用的安全性。
使用main.jsbundle
构建和运行发布方案适用于以下场景:
- 发布应用到线上环境:在将React Native应用发布到线上环境时,使用
main.jsbundle
可以减少包大小和提高应用性能。 - 优化应用性能:对于包含大量
JavaScript
代码的应用,使用main.jsbundle
可以减少加载时间,提高应用性能。