Since updating to 3.3.0, running out of memory

[daviseford]

Describe the bug

After upgrading to 3.3.0 and TS 3.7.3 (was previously on 3.2.0 and TS 3.7.2), I am unable to run yarn start

I receive this error: FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

Reverting to react-scripts v3.2.0 resolves this issue - Typescript being at 3.7.3 or 3.7.2. has no effect, so I've narrowed it to react-scripts.

Did you try recovering your dependencies?

Yes, blew away node_modules and re-ran yarn, tried without a lock file, etc. No dice.

Environment

Windows 10, VSCode (also occurs on my macbook)

[endiliey]

You’ll need a reproducible repo for this. There are some dependencies upgrade in 3.3.0 and that could have taken more memory usage.

[xiaoxiangmoe]

I also encountered the same problem in the company project.

[anhquande]

me too

[daviseford]

I apologize because this isn't a minimally reproducible repo, but this is my repo having problems: https://github.com/daviseford/aos-reminders

Just running yarn, upgrading react-scripts to 3.3.0, and running yarn start will give you the bad behavior.

I will look into creating a minimal version after work.

[mrmckeb]

Have you tried removing the existing node_modules, then reinstalling? Maybe also removing the lockfile? Just out of interest.

[daviseford]

Yes to both.

[MasterCassim]

I had the same error with nodejs v10; upgrading to nodejs v12 fixed the issue for me.

[daviseford]

I am on v12.11.0

[xiaoxiangmoe]

I am on v13.2.0

[petetnt]

Temporary workaround is to set a larger max-old-space-size eg, react-scripts --expose-gc --max-old-space-size=8192 ... as stated in https://github.com/facebook/create-react-app/issues/8130#issue-535323604

[abrcdf1023]

Use @petetnt suggestion is work but it take a lot of build time.

[MichaelCharles]

I experienced this today, however it was from updating from 3.0.1 to 3.2.0. After reverting to 3.0.1 the problem disappeared.

I'll attach the generated report.json file. report.20191213.130235.34745.0.001.json.zip

[chawax]

Same problem here. I upgraded to react-scripts 3.3.0 and webpack 4.41.2 and I had this memory problem.

@petetnt suggestion did not help

Disabling sourcemaps generation solved the problem, but you need them when developing !

[robsco-git]

Please see https://github.com/wojtekmaj/react-pdf/issues/498#issuecomment-566948710 - a response to what I think may be the same issue. I am not sure how one fixes this within the context of create-react-app.

[astrada]

It looks like this issue: babel/babel#10875. That's fixed in https://github.com/babel/babel/releases/tag/v7.7.7. create-react-app should bump the @babel/core dependency.

[yusufnb]

Having this same issue since I upgraded react-scripts. Node version v13.1.0. react-scripts 3.3.0.

[gnmerritt]

The following in package.json fixed the issue for me (react-scripts 3.3.0, react-pdf) without requiring the memory increase flags:

  "devDependencies": {
    "@babel/core": "^7.7.7",

[benbruscella]

@gnmerritt this didn't work for us, anything else you changed?

[erik-sytnyk]

I've been able to run app changing npm start script

      "start": "react-scripts --max_old_space_size=4096 start",

[jacobwod]

The following in package.json fixed the issue for me (react-scripts 3.3.0, react-pdf) without requiring the memory increase flags:

  "devDependencies": {
    "@babel/core": "^7.7.7",

Adding "@babel/core": "^7.7.7", to devDependencies did work in my project, even though I didn't have explicit dependency to @bable/core previously in package.json.

There were (and still are) multiple dependencies to @bable/core in package-lock.json, of course. Intrestingly, those "dependencies of dependencies" still refer to 7.7.4 in package-lock.json. But the project starts and builds fine.

[beaulac]

If you're using yarn (npm doesn't support this natively unfortunately) you can use resolutions instead of devDependencies

"resolutions": {
  "@babel/core": "^7.7.7"
}

Using npm with devDependencies might not always work immediately since NPM is non-deterministic and the node_modules tree depends on the order of installation.

[jacobwod]

Thank you @beaulac, had no idea of resolutions, but after reading the docs it seems like a good reason to migrate to Yarn.

In the meantime I've downgraded to "react-scripts": "3.2.0", which uses an older "@babel/core" and starts/builds fine for me.

[Chnapy]

I have this issue with 3.3 AND 3.2 (I come from 2.1), with node v10.x.

Note that upgrading node to v12 solve this issue. edit nevermind it doesn't work either with node v12, it may be an issue relative to other deps of my project, but it appeared only since CRA 3.2.

[MatueszDev]

setting GENERATE_SOURCEMAP=false in .env work for me

[mehrdadgit]

If you don't want to migrate to yarn or downgrade to react-scripts@3.2.0,

npm update @babel/core --depth 3

fixed the issue for me (Node v12.4.1)

[aquan9]

Same issue, Downgrading to react-scripts@3.2.0 worked for me.

[mheavenor]

3.3.1 still exhibits the same behavior. Production build succeeds with GENERATE_SOURCEMAP=false but development build still broken 😢

[ianschmitz]

3.3.1 includes babel 7.8.4 which should include the fix on babel's side. Can anyone else confirm that 3.3.1 fixes the issue they were having previously?

[leclercb]

I still have the same out of memory issue with 3.3.1. Only 3.2.0 works.

Btw, I have two similar projects, more or less the same size and dependencies, one was failing with the out of memory with 3.3.0, one was working. With 3.3.1 both are now failing with the out of memory. 3.2.0 works for both.

[astrada]

Can anyone else confirm that 3.3.1 fixes the issue they were having previously?

It fixed it for me (I have pdfjs-dist among dependencies, that was causing the issue).

[Chnapy]

3.3.1 includes babel 7.8.4 which should include the fix on babel's side. Can anyone else confirm that 3.3.1 fixes the issue they were having previously?

It didn't change anything on my side :(

[LazerJesus]

+1

[RIP21]

@MatueszDev way worked for me. Still feels super hacky. I'm on 3.3.1. Waiting for a proper fix.

[RIP21]

Just to clarify. 3.4 the same thing, and it's supercritical cause it kills our error reporting because we don't upload source maps :(

[RIP21]

Wondering if anyone here that has this issue has graphql.macro or any kind of babel macro? I think it may be connected to a memory leak.

I had a reusable module in my monorepo that has been using grpahql.macro that was importing huge GraphQL Schema, so the file gets like 40-50k LOC of GraphQL AST JSON inside, and any test or app that is based on CRA that was importing this library started to get out of memory error. After, I isolated these functions, that are using macro, into a separate more specific module, all apps/test files that do not rely on this specific module, started to work just fine. Before at 3.2.0, code was exactly the same and it all was good.

[ianschmitz]

If someone can provide a repository that can reproduce this problem it would be greatly appreciated and would help get this fixed faster. Thanks!

[xiaoxiangmoe]

https://github.com/xiaoxiangmoe/create-react-app-running-out-of-memory

@ianschmitz

If we change "react-scripts": "3.3.0" to "react-scripts": "3.4.0", the error will disappear.

[lk-jeffpeck]

I found this to happen in dotenvi when I have a string with { curly brackets } in my yaml file. I am not sure of a good workaround though. And I'm not sure if it's related.

[RIP21]

BTW. Disabling of the sourcemaps doesn't work in 100% so this issue is impossible to fix temporarily by its disabling. Usually, it's all good on CI, when fresh installs, but when people start to do some changes or adding some dependencies eventually it stops working with OOM. Maybe symlinks can be in effect here? We're using rush.js monorepo solution which is heavy on them.

[RIP21]

Another hypothesis comes from relative and absolute imports.

import { setLocalStorage } from ‘helpers/utils’

kills watch more for people While making it

import { setLocalStorage } from ‘../../helpers/utils’ 

Makes it all working. Also somehow changing from INLINE_RUNTIME_CHUNK=false to true help people sometimes.

Also, we're having out of memory in tests, like each of it fails with OOM from time to time. Feels like complete random info, but I try to get to give some clue, so at least there is some small chance to find it and fix somehow... I assume Babel is still to blame.

[sxqnicholas96]

If you don't want to migrate to yarn or downgrade to react-scripts@3.2.0,

npm update @babel/core --depth 3

fixed the issue for me (Node v12.4.1)

Can confirm this worked for me! (Node v12.14.0)

[lamqson]

https://github.com/xiaoxiangmoe/create-react-app-running-out-of-memory

@ianschmitz

If we change "react-scripts": "3.3.0" to "react-scripts": "3.4.0", the error will disappear.

It is still happening in 3.4.0

[ARMATAV]

Ran into this after;

yarn add pdfjs-dist @types/pdfjs-dist

Resolved with;

"resolutions": {
    "@babel/core": "^7.7.7"
},

And no other changes.

[Chnapy]

Hi,

Just referencing these material-ui related issues:

• https://github.com/microsoft/TypeScript/issues/34801
• https://github.com/mui-org/material-ui/issues/19113

My project, which have this memory issue, is using material-ui, so maybe there is a link between this issue and these.

For people who is in my case, you can try to remove material-ui type checking in your project to see if there is any change by doing this tip: https://github.com/mui-org/material-ui/issues/19113#issuecomment-592797820 I didn't try myself yet.

[LazerJesus]

I dont use material ui and still have this issue

[buncis]

I also got the error with new project npx create-react-app and installing plotly

adding the memory flag to start scripts fixing the issue

"start": "react-scripts --max_old_space_size=4096 start",

my package.json

{
  "name": "plot.ly",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "plotly.js": "^1.52.3",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-plotly.js": "^2.4.0",
    "react-scripts": "3.4.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

[luminaxster]

Thank you so much @petetnt, @yegor-sytnyk, and @buncismamen, I had the same error using build and adding max_old_space_size fixed it: "build": "react-scripts --max_old_space_size=4096 build" I know is just a hot-fix, but I take it meanwhile.

[ARMATAV]

Error reappears when building for production through rescripts build pipeline.

...Even after removing pdfjs-dist.

[lamqson]

Just tried with v3.4.1. It is still failing. I include here the crash report just in case:

report.20200328.113538.43465.0.001.txt

And when I turn off source map generation: export GENERATE_SOURCEMAP=false, it works fine. But we really need to have source-map turned on though.

Thanks.

[JGeiser9]

I still have the same out of memory issue with 3.3.1. Only 3.2.0 works.

Btw, I have two similar projects, more or less the same size and dependencies, one was failing with the out of memory with 3.3.0, one was working. With 3.3.1 both are now failing with the out of memory. 3.2.0 works for both.

Had to revert and pin my package.json to 3.2.0 to avoid heap memory issues as well