Sunday, March 31, 2019

The development server returned response error code 500

This post explains how to fix the "The development server returned response error code: 500" issue in react native application. The development server returned response error code: 500. react-native android error Unable to resolve module `AccessibilityInfo` from.., Module `AccessibilityInfo` does not exist in the Haste module map.

The development server returned response error code 500

react-native run-android 500 red screen issue

Screen show red screen and following message at top “The development server returned response error code: 500”.
It also gives different other message detail(Unable to resolve module `AccessibilityInfo` from.., Module `AccessibilityInfo` does not exist in the Haste module map.) and Issue Number #401.

Lets follow the below steps, that help you to resolve The development server returned response error code: 500 error message in react native application.

Solution 1 : 

1. Go to project directory
2. Open package.json file in editor
3. Change “react-native” and “babel-preset-react-native” version as like next step
4. “react-native”: “0.55.2”
5. “babel-preset-react-native”: “4”
6. Save file
7. run yarn install or npm install

Note: When you done above steps and run react-native run-android some minor warnings comes due to Downgrade “react-native” and compatibility. Don’t worry about it, just ignore them.

Solution 2 : 

1. Goto Your_React_Native_Project -> node_modules -> react-native -> scripts -> launchPackager.bat . Open the launchPackager.bat file in Notepad or Notepad ++  editor.

2.  Put below line of code in launchPackager.bat file.
node "%~dp0..\cli.js" start --projectRoot ../../../

Complete Source code of launchPackager.bat file after making changes:
:: Copyright (c) Facebook, Inc. and its affiliates.
::
:: This source code is licensed under the MIT license found in the
:: LICENSE file in the root directory of this source tree.

@echo off
title Metro Bundler
call .packager.bat

node "%~dp0..\cli.js" start 

node "%~dp0..\cli.js" start --projectRoot ../../../ 

pause
exit

3. Now we need to give the project root path to metro instance object. So GoTo React_Native_Project -> node_modules -> @react-native-community -> cli -> build -> commands -> runAndroid.js . Open the runAndroid.js file in Notepad editor.

4. Find cwd: scriptsDir in const procConfig block.
const procConfig = {
    cwd: scriptsDir
  };

5. Replace cwd: scriptsDir with cwd: process.cwd() code & save the file.
const procConfig = {   
    cwd: process.cwd() 
};

6. Now goto your project’s main root folder in command prompt or Terminal and execute react-native run-android command.

Hopefully this solution resolve your issues and also you can let us know your concern in below comment box.

1 comment:

  1. How to change launchPackager.command (the Mac launchPackager..bat), to fit the MacOs way?

    ReplyDelete