Mitesh K
Mitesh K

Reputation: 772

React native : Failed to construct transformer: Error: Cannot create a string longer than 0x1fffffe8 characters

hear is the screenshot of the error

package.json

{
  "name": "project",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-community/async-storage": "^1.12.0",
    "@react-native-community/clipboard": "^1.2.3",
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/drawer": "^5.9.0",
    "@react-navigation/native": "^5.7.3",
    "@react-navigation/stack": "^5.9.0",
    "@twotalltotems/react-native-otp-input": "^1.3.11",
    "jetifier": "^1.6.6",
    "react": "16.13.1",
    "react-native": "^0.63.2",
    "react-native-barcode-builder": "^2.0.0",
    "react-native-biometrics": "^2.1.4",
    "react-native-chart-kit": "^6.6.1",
    "react-native-gesture-handler": "^1.7.0",
    "react-native-image-picker": "^2.3.3",
    "react-native-localization": "^2.1.6",
    "react-native-paper": "^4.0.1",
    "react-native-reanimated": "^1.13.0",
    "react-native-safe-area-context": "^3.1.6",
    "react-native-screens": "^2.10.1",
    "react-native-splash-screen": "^3.2.0",
    "react-native-svg": "^12.1.0",
    "react-native-swipe-list-view": "^3.2.3",
    "react-native-vector-icons": "^7.0.0"
  },
  "devDependencies": {
    "@babel/core": "7.11.4",
    "@babel/runtime": "7.11.2",
    "@react-native-community/eslint-config": "1.1.0",
    "babel-jest": "25.5.1",
    "eslint": "6.8.0",
    "jest": "25.5.4",
    "metro-react-native-babel-preset": "0.59.0",
    "miragejs": "^0.1.40",
    "react-test-renderer": "16.13.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

i did't fonund any answers related this except this : https://github.com/facebook/react-native/issues/28189

but it won't work for me...

myapp successfully install on android emulator but stuck at splash screen ...

the app works fine in my office computer but it did't work on my own computer

my node version : v14.10.0

so please help me.

Upvotes: 17

Views: 32298

Answers (17)

Mian Yousaf
Mian Yousaf

Reputation: 1

in my android/.gradlew/7.5.1/executionHistory/executionHistory.bin was causing issue as it was 590mbs and was unreadable,

Solved: Deleted executionHistory.bin and rerun the metro server//rebuild the app and it created a new file with smaller file size!

Upvotes: 0

amit pandya
amit pandya

Reputation: 1388

I have followed the below steps and it worked for me:

1. cleared cache and unnecessary space from my mac.

2. cleared npm cache and watchman.

3. cleared gradle.

4. restarted the metro server.

Upvotes: 0

Aidan Doherty
Aidan Doherty

Reputation: 1072

This answer helped me a lot https://stackoverflow.com/a/41963217/2915928

For my case my app had a lot of audio files being included in android app bundle, this was then creating a large zip file in android/build/intermediates. So rather than deleting the build folder this tell the packager to ignore the file causing the issue.

Here is an example of my fix replace asset_pack_bundle with whatever file or directory you are having an issue with.

const exclusionList = require('metro-config/src/defaults/exclusionList');

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
  },
  resolver: {
    blacklistRE: exclusionList([/asset_pack_bundle\/.*/]),
  },
};

Upvotes: 1

Nicholas Mberev
Nicholas Mberev

Reputation: 1841

Just delete any zipped file in your project root directory. In my case I had packaged the app and sent it to someone and forgot to remove the zipped file thereafter.

Upvotes: 1

Vladislav Zaynchkovsky
Vladislav Zaynchkovsky

Reputation: 3319

I had similar issue. After some debugging I found that it crashes because of asset file, which was generated by android build previously.

I don't know why it is trying to import this file (I experience this issue on ios), but when I removed folder ./android/app/build it started working.

Even if issue is not related to this dir in your case, you need to find which asset caused this issue.

Upvotes: 1

Sir'Damilare
Sir'Damilare

Reputation: 314

I got this error when i run build.

But This fix worked for me. I deleted a zip file at the root of my app (I compressed the whole project to zip at end of the previous day for backup)

And i stopped the server with ctr + c command Then restarted the server with npx react-native start

All now works fine after restarting the server and without having to run build again.

Upvotes: 0

Zeeshan
Zeeshan

Reputation: 184

In my case there was a zip file of whole project in the project directory which cause the issue when I remove it from the project directory and run

npm start --reset cache

it worked for me.

Upvotes: 1

Mr.shakeel
Mr.shakeel

Reputation: 304

Make sure you don't have any large files in your root project including (mp4, images, .zip, etc)?

Upvotes: 2

faraz naeem
faraz naeem

Reputation: 121

Check if there any unrelated file or zip in your project structure/folder if yes then delete file and error will be resolved

Upvotes: 2

mrsnow07
mrsnow07

Reputation: 31

To figure out what file caused an error I used @dirk approach. I don't sure why but my App_name.app.dSYM.zip became too large (536MB) so the node was unable to read it because of the 512MB limitation. It might be some different file in your case. Here is a patch-package to get more information about the file which caused this error

diff --git a/node_modules/jest-haste-map/build/worker.js b/node_modules/jest-haste-map/build/worker.js
index 1996d4a..1f17f11 100644
--- a/node_modules/jest-haste-map/build/worker.js
+++ b/node_modules/jest-haste-map/build/worker.js
@@ -146,7 +146,11 @@ function _worker() {
 
     const getContent = () => {
       if (content === undefined) {
-        content = _gracefulFs().default.readFileSync(filePath, 'utf8');
+        try {
+          content = _gracefulFs().default.readFileSync(filePath, 'utf8');
+        } catch (err) {
+          throw new Error(`error readFileSync ${filePath} : ${err.message}`);
+        }
       }
 
       return content;


Upvotes: 3

M_droid
M_droid

Reputation: 2778

It took me the whole day but I solved it. I still can't understand why I'm getting this error when I want to launch the app on iOS but:

removing the build directory in android/app fixed it.

Upvotes: 1

In my own case I noticed I was using an mp4 video file for my react native application which was too large in size. I had to delete it and that was the fix for me

Upvotes: 1

Dirk
Dirk

Reputation: 2207

For others having the same problem, and looking for a way to debug:

  • Edit /node_modules/jest-haste-map/build/worker.js

  • Wrap readFileSync in a try...catch, like this:

  const getContent = () => {
    if (content === undefined) {
      try {
        content = fs().readFileSync(filePath, 'utf8');
      } catch (err) {
        throw new Error(`error readFileSync ${filePath} : ${err.message}`);
      }
    }

    return content;
  };
  • (re)start metro bundler:

/node_modules/react-native/scripts/launchPackager.command; exit

My output:

To reload the app press "r"
To open developer menu press "d"

Failed to construct transformer:  Error: error readFileSync <my project path>/some/big/file/that/caused/error : Cannot create a string longer than 0x1fffffe8 characters
    at getContent (<my project path>/node_modules/jest-haste-map/build/worker.js:133:15)
    at Object.worker (<my project path>/node_modules/jest-haste-map/build/worker.js:162:23)
    at execFunction (<my project path>/node_modules/jest-worker/build/workers/processChild.js:145:17)
    at execHelper (<my project path>/node_modules/jest-worker/build/workers/processChild.js:124:5)
    at execMethod (<my project path>/node_modules/jest-worker/build/workers/processChild.js:128:5)
    at process.messageListener (<my project path>/node_modules/jest-worker/build/workers/processChild.js:46:7)
    at process.emi

Hope this helps others having the same problem!

Upvotes: 7

Domotor Zsolt
Domotor Zsolt

Reputation: 614

I've tried to log the file that causing the error, but console.log wasn't working. I come up with a quick hack to throw filePath then I've saw that a zip file, that I keeped as a backup, was the issue.

For some way react doesn't liked it so I have to move it outside of the project folder

Upvotes: 20

Monteiro4
Monteiro4

Reputation: 31

I've run into the exact same error. Turns out it was an auto-generated big file from gradle (> 700MB) inside "android.gradle\6.0.1\executionHistory"

Upvotes: 3

FansZ
FansZ

Reputation: 31

I was running into the same problem.

 warning: the transform cache was reset.                                                                          
                 Welcome to React Native!                                                                        
                Learn once, write anywhere 
Failed to construct transformer:  Error: Cannot create a string longer than 0x1fffffe8 characters                
    at Object.slice (buffer.js:608:37)                                                                           
    at Buffer.toString (buffer.js:805:14)                                                                        
    at Object.readFileSync (fs.js:421:41)                                                                        
    at getContent (J:\expoProjects\rn-cnn\node_modules\metro\node_modules\jest-haste-map\build\worker.js:149:41) 
    at Object.<anonymous> (J:\expoProjects\rn-cnn\node_modules\metro\node_modules\jest-haste-map\build\worker.js:
199:9)                                                                                                           
    at Generator.next (<anonymous>)                                                                              
    at asyncGeneratorStep (J:\expoProjects\rn-cnn\node_modules\metro\node_modules\jest-haste-map\build\worker.js:
78:24)                                                                                                           
    at _next (J:\expoProjects\rn-cnn\node_modules\metro\node_modules\jest-haste-map\build\worker.js:98:9)        
    at J:\expoProjects\rn-cnn\node_modules\metro\node_modules\jest-haste-map\build\worker.js:103:7               
    at new Promise (<anonymous>) {                                                                               
  type: 'Error',                                                                                                 
  code: 'ERR_STRING_TOO_LONG'                                                                           

I solved the error by changing the node version to v14+ and then reverting back to the old version of node v10.15.3.

Upvotes: 3

ddaaggeett
ddaaggeett

Reputation: 177

Moving any large asset files [pictures,videos,etc...] up out of the project directory. https://github.com/facebook/react-native/issues/28189#issuecomment-592918995

Upvotes: 1

Related Questions