xcode main.jsbundle 不存在。这一定是 + echo 'react native 的错误

main.jsbundle does not exist. this must be a bug with + echo 'react native

提问by Louis Kurniawan

I tried to archive my react native project using Product> Archiveon XCode9.2. But Xcode produce this error:

我尝试在 XCode9.2 上使用Product> Archive来存档我的React Native 项目。但是 Xcode 产生这个错误：

File /Users/louis/Library/Developer/Xcode/DerivedData/Scavenger-evyvzocndqoghkclcbwewolywniz/Build/Products/Release-iphoneos/Scavenger.app/main.jsbundle does not exist. This must be a bug with


My Environment:
  OS: macOS Sierra 10.12.6
  Node: 9.3.0
  npm: 5.5.1
  Watchman: 4.7.0
  Xcode: Xcode 9.2 Build version 9C40b
  Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
  react: ^16.0.0 => 16.2.0
  react-native: ^0.50.3 => 0.50.4

I also tried to run on terminal
react-native bundle --entry-file='index.ios.js' --bundle-output='./ios/Scavenger/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'but ended up with error Loading dependency graph... Unexpected end of JSON input

我也尝试在终端上运行，
react-native bundle --entry-file='index.ios.js' --bundle-output='./ios/Scavenger/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'但最终出现错误加载依赖关系图...意外的 JSON 输入结束

XCode error.

XCode 错误。

回答by Cuong Lam

This issue take me some days to fixed. I got this issue when run the build on travis-ci. Here is my fix:

这个问题需要我几天才能解决。在 travis-ci 上运行构建时遇到了这个问题。这是我的修复：

Add this line to scriptsin your package.json file.

将此行添加到scripts您的 package.json 文件中。

"build:ios": "react-native bundle --entry-file='index.js' --bundle-output='./ios/main.jsbundle' --dev=false --platform='ios'"

Now your can run the command to generate main.jsbundle. yarn build:iosor npm run build:ios

现在您可以运行命令来生成main.jsbundle. yarn build:ios或者npm run build:ios

Open the Xcode > Select project target > add main.jsbundleto Copy Bundle Resourcein Build Phases. (image below).

打开 Xcode > Select project target > add main.jsbundleto Copy Bundle Resourcein Build Phases。（下图）。

回答by Kartik Shah

Comment this line in AppDelegate.m

在 AppDelegate.m 中注释此行

 jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; 

Use this line:-

使用这一行：-

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; 

After that run this to make jsbundle:-

之后运行它来制作 jsbundle:-

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

Run after this command in xcode . Hope it will make bundle and there is no such error after that ... Thanx

在 xcode 中运行此命令。希望它会打包，之后就没有这样的错误了......谢谢

回答by Nidhi Shah

This happens when there is no offline bundle file in your project, I had the same problem and this worked for me.

当您的项目中没有离线捆绑文件时会发生这种情况，我遇到了同样的问题，这对我有用。

I have added the below line to my package.json file, under scriptssection, so I don't have to type it every time I want to generate an offline bundle.

我已将以下行添加到我的 package.json 文件的scripts部分下，因此每次我想生成离线包时都不必键入它。

"build:ios": "react-native bundle --entry-file='index.ios.js' --bundle-output='./ios/YourAppName/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'"

And then run this command in your application projects folder:

然后在您的应用程序项目文件夹中运行此命令：

npm run build:ios

npm 运行构建：ios

After running the above command, new main.jsbundlewill be generated in your ios/YourAppNamedirectory.

运行上述命令后，main.jsbundle将在您的ios/YourAppName目录中生成新的。

Next, open your project using XCode, right click on your project name then click Add Files to "YourProjectName", choose the main.jsbundlefile that was generated, and then build again.

接下来，使用 XCode 打开您的项目，右键单击您的项目名称，然后单击 Add Files to " YourProjectName"，选择main.jsbundle生成的文件，然后再次构建。

Now it might be working well.

现在它可能运行良好。

I am using:

我在用：

 "react": "16.0.0-alpha.12",
 "react-native": "^0.48.3",

回答by Vinod Radhakrishnan

Recommend to use the latest Xcode and React Native versions.My React Native Version: 0.56 and Xcode 10

推荐使用最新的 Xcode 和 React Native 版本。我的 React Native 版本：0.56 和 Xcode 10

Step 1:Change AppDelegate.mfile

第 1 步：更改 AppDelegate.m文件

    //  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#ifdef DEBUG
  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
  jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif

Step 2:Change Xcode Build Configuration to "Release"

第 2 步：将Xcode 构建配置更改为“发布”

Goto Products> Scheme> Edit Scheme> change Debug to release

转到产品>方案>编辑方案>将调试更改为发布

if you are using Xcode 10+ please change Build system to Legacy Build System under File> ProjectWorkSpace Settings> Build System

如果您使用的是 Xcode 10+，请在 File> ProjectWorkSpace Settings> Build System 下将 Build system 更改为 Legacy Build System

Step 3:Upgrade your "babel-preset-react-native" to 5.0.1, if it does not exist in your package.json file please add it.

第 3 步：将您的“babel-preset-react-native”升级到 5.0.1，如果您的 package.json 文件中不存在请添加它。

Remove NodeModules and package.lock file and add it (npm install or yarn install).

删除 NodeModules 和 package.lock 文件并添加它（npm install 或 yarn install）。

Step 4:Change ".babelrc.js" file

第 4 步：更改“.babelrc.js”文件

Add " presets: ["module:metro-react-native-babel-preset"]

添加 ” presets: ["module:metro-react-native-babel-preset"]

Step 5:Open Terminal

第 5 步：打开终端

Open the terminal and navigate to your project directory run this command

打开终端并导航到您的项目目录运行此命令

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

this will generate a "main.jsbundle" file in iOS folder

这将在 iOS 文件夹中生成一个“main.jsbundle”文件

Step 6:Add "main.jsbundle" file into Xcode.

第 6 步：将“main.jsbundle”文件添加到 Xcode 中。

Open Xcode and navigate to "Build Phase" under "Copy Bundle Resource" add "main.jsbundle" file.

打开 Xcode 并导航到“Copy Bundle Resource”下的“Build Phase”，添加“main.jsbundle”文件。

Clean your project also clear your derived data in Xcode. This will build your project in Release mode.

清理你的项目也会清理你在 Xcode 中的派生数据。这将在发布模式下构建您的项目。

For "Archive" error

对于“存档”错误

Add this dependency into your "pod file"

将此依赖项添加到您的“ pod 文件”中

pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'CxxBridge'
  ]
pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

Remove pod and pod.lock and add again. (pod install)

删除 pod 和 pod.lock 并再次添加。（吊舱安装）

Happy Coding :)

快乐编码:)

回答by Jaydeep Patel

This commnad works for me.

这个命令对我有用。

react-native bundle --entry-file ./index.ios.js --platform ios --bundle-output ios/main.jsbundle

回答by trithucsv

You need to run the following command:

您需要运行以下命令：

react-native bundle --entry-file ./index.js --platform ios --bundle-output ios/main.jsbundle

After that, the app with the static bundle is installed on the real device. But because the nature of the static file, whenever I modify the source code, I need to run that command again to reflect the changes. (You can see next error in command)

之后，带有静态包的应用程序安装在真实设备上。但是由于静态文件的性质，每当我修改源代码时，我都需要再次运行该命令以反映更改。（您可以在命令中看到下一个错误）

回答by Florin Dobre

In my case I got this error at archive after updating from RN 0.53.3 to 0.55.4

就我而言，从 RN 0.53.3 更新到 0.55.4 后，我在存档时遇到此错误

/Users/<myuser>/Desktop/projects/<myProjectName>mobileapp/index.ios.js: Plugin 0 specified in "/Users/<myUserName>/Desktop/projects/<myProjectName>mobileapp/node_modules/babel-preset-react-native/index.js" provided an invalid property of "default" (While processing preset: "/Users/<myUserName>/Desktop/projects/<myProjectName>mobileapp/node_modules/babel-preset-react-native/index.js")

+ [[ false != true ]]
+ [[ ! -f /Users/<myUserName>/Library/Developer/Xcode/DerivedData/<myProjectName>Mobile-ghzbbftkebcwlvayfocqahvzifbe/Build/Intermediates.noindex/ArchiveIntermediates/<myProjectName>Mobile/BuildProductsPath/Release-iphoneos/<myProjectName>Mobile.app/main.jsbundle ]]
+ echo 'error: File /Users/<myUserName>/Library/Developer/Xcode/DerivedData/<myProjectName>Mobile-ghzbbftkebcwlvayfocqahvzifbe/Build/Intermediates.noindex/ArchiveIntermediates/<myProjectName>Mobile/BuildProductsPath/Release-iphoneos/<myProjectName>Mobile.app/main.jsbundle does not exist. This must be a bug with'
error: File /Users/<myUserName>/Library/Developer/Xcode/DerivedData/<myProjectName>Mobile-ghzbbftkebcwlvayfocqahvzifbe/Build/Intermediates.noindex/ArchiveIntermediates/<myProjectName>Mobile/BuildProductsPath/Release-iphoneos/<myProjectName>Mobile.app/main.jsbundle does not exist. This must be a bug with
+ echo 'React Native, please report it here: https://github.com/facebook/react-native/issues'
React Native, please report it here: https://github.com/facebook/react-native/issues
+ exit 2

A big importance to fix this had the line above the error related to babel-preset-react-native

解决这个问题很重要的是与babel-preset-react-native相关的错误上方的那一行

After many hours of trying several workarounds I found a solution by downgrading babel-preset-react-nativefrom ^5.0.2to ^4.0.0to make the archive process work.

几个小时的努力几种解决方法后，我被降级找到了解决方案babel-preset-react-native，从^5.0.2以^4.0.0使存档过程的工作。

回答by Louis Kurniawan

Problem solved after I rewrite shell script. Project> Build Phases> Bundle React Native code and images. There was blank space character in the script.

重写shell脚本后问题解决。项目>构建阶段>捆绑 React Native 代码和图像。脚本中有空格字符。

回答by user8637708

In my case, it was caused by the javascript code. The error showed at the Metro Bundler(Command Line). Check the Metro Bundler, Does it have an Error or not.

就我而言，它是由 javascript 代码引起的。Metro Bundler（命令行）中显示的错误。检查 Metro Bundler，它是否有错误。

回答by haleonj

For some people like me this is simply an indication of an error in the JavaScript code. I discovered this to be the case after entering the following command: npx react-native bundle --entry-file index.js --bundle-output "bundle.bundle". Android users would need to specify the platform like so: npx react-native bundle --entry-file --platform "ios" index.js --bundle-output "bundle.bundle".

对于像我这样的一些人来说，这只是 JavaScript 代码中错误的指示。输入以下命令后，我发现情况确实如此：npx react-native bundle --entry-file index.js --bundle-output "bundle.bundle". Android 用户需要像这样指定平台：npx react-native bundle --entry-file --platform "ios" index.js --bundle-output "bundle.bundle".

The bundle failed and the syntax error was shown. Any attempt to open the offending code in a simulator would show the error too.

捆绑失败并显示语法错误。任何在模拟器中打开违规代码的尝试也会显示错误。