嘿，我来分享几个实用的方法帮你分析用create-react-native-app（CRNA）创建的React Native应用Bundle体积，都是我平时调试项目常用的，亲测有效！

1. 先导出待分析的Bundle包 #

首先得拿到要分析的Bundle文件，不同项目状态下的导出方式不一样：

• 如果你还在Expo管理的CRNA项目流程里：
  执行对应平台的导出命令，比如Web平台用expo export:web，iOS/Android用expo export:ios或expo export:android，命令执行完后会在项目目录里生成对应的bundle文件和静态资源。
• 如果已经 eject 转为原生管理的项目：
  用React Native官方的打包命令生成Bundle，比如iOS平台：

  react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle --assets-dest ios
  

  Android平台：

  react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
  

2. 用React Native官方工具快速分析 #

RN自带了一个轻量的Bundle分析工具，能帮你快速查看模块占比：

• 确保你已经安装了react-native-cli（没装的话执行npm install -g react-native-cli）
• 针对生成好的Bundle文件执行分析命令，比如Android的Bundle：

  react-native analyze-bundle --bundle android/app/src/main/assets/index.android.bundle
  

  这个命令会生成一个交互式的可视化页面，你可以展开每个模块，清楚看到哪个依赖或组件占了最多体积。

3. 用source-map-explorer做精细化可视化分析 #

这个工具是开发者圈子里常用的，能把Bundle和对应的source map结合，生成更直观的色块树形图，方便定位大体积代码：

• 先安装依赖：npm install --save-dev source-map-explorer
• 打包时记得生成source map，比如在RN打包命令里加上--sourcemap-output参数：

  react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res --sourcemap-output index.android.bundle.map
  

• 最后运行分析命令：

  npx source-map-explorer android/app/src/main/assets/index.android.bundle index.android.bundle.map
  

  浏览器会自动打开分析页面，不同色块代表不同模块，点击就能查看具体文件，一眼就能揪出体积大的“元凶”。

4. Expo项目专属：用Expo Bundle Analyzer一步到位 #

如果你还在Expo生态里，官方提供的这个插件能省掉手动导出的步骤，直接帮你完成分析：

• 安装插件：expo install @expo/bundle-analyzer
• 运行分析命令：npx expo analyze
  它会自动帮你生成Bundle并打开可视化分析页面，全程不用手动操作，特别适合Expo管理的CRNA项目。

几个额外的优化小提示 #

• 重点关注第三方依赖：大部分Bundle体积过大的问题都是因为引入了体积庞大的第三方库，比如某些全量引入的UI组件库、图表库，看看有没有轻量化的替代方案，或者按需引入未使用的部分。
• 开启Tree Shaking：确保你的项目用ES模块语法导入（比如import而不是require），打包工具会自动剔除未使用的代码，减少体积。
• 压缩静态资源：图片、字体这些静态资源也会占不少体积，尽量用WebP格式的图片，字体只引入需要的字重和字符集，避免全量引入。

内容的提问来源于stack exchange，提问作者Stanislav Mayorov