CODEWITHSUNDEEP
reactjsdockerdockerfile
Oğuzcan Budumlu
Oğuzcan Budumlu

Reputation: 621

Dockerizing React in production mode: FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

I am trying to dockerize a React app. Although I can do it for development mode, I could not do for production mode.

I can also build it in local but I got this error when I tried it Docker:

Step 10/14 : RUN npm run build
 ---> Running in 2c95d18e526c

> [email protected] build /x
> react-scripts build

Creating an optimized production build...
FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x8fb090 node::Abort() [node]
 2: 0x8fb0dc  [node]
 3: 0xb0322e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [node]

<--- Last few GCs --->

[25:0x4394f50]   192197 ms: Mark-sweep 1375.9 (1444.4) -> 1366.4 (1444.4) MB, 993.9 / 0.0 ms  (average mu = 0.209, current mu = 0.125) allocation failure scavenge might not succeed
[25:0x4394f50]   193285 ms: Mark-sweep 1378.5 (1444.4) -> 1368.9 (1447.9) MB, 959.5 / 0.0 ms  (average mu = 0.166, current mu = 0.118) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x277faa75be1d]
    1: StubFrame [pc: 0x277faa7047bb]
    2: ConstructFrame [pc: 0x277faa70d145]
Security context: 0x3fdee7f9e6c1 <JSObject>
    3: DoJoin(aka DoJoin) [0x3fdee7f85e69] [native array.js:~87] [pc=0x277faab5432d](this=0x25a0974826f1 <undefined>,l=0x0b1a02686109 <JSArray[5]>,m=5,A=0x25a0974828c9 <true>,w=0x0817ee2325c9 <String[1]: />,v=0x25a0974829a1 <false>)
    4: Join(aka Join) [0x3fdee7f85eb9] [native...

 4: 0xb03464 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [node]
 5: 0xef74c2  [node]
 6: 0xef75c8 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [node]
 7: 0xf036a2 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [node]
 8: 0xf03fd4 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
 9: 0xf06c41 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [node]
10: 0xed00c4 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) [node]
11: 0x117024e v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, v8::internal::Isolate*) [node]
12: 0x277faa75be1d
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2020-07-01T08_22_44_303Z-debug.log
The command '/bin/sh -c npm run build' returned a non-zero code: 1

My Dockerfile is like this:

FROM node:10 as build
 
COPY ./x /x
COPY ./y /y

WORKDIR /y
RUN npm install
RUN npm run build

WORKDIR ../
WORKDIR /x

RUN npm install 


#ENV NODE_OPTIONS=--max-old-space-size=8192

RUN npm run build

# production environment
FROM nginx:stable-alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

X is dependent to Y as I demonstrate package.json of X:

"dependencies": {
    "someName": "file:../y",
}

I tried many ways to tackle this issue:

Thank you in advance for your answers!

Upvotes: 20

Views: 31038

Answers (5)

Aaron
Aaron

Reputation: 767

Running the build as part of a Docker image creation none of these suggestions worked for me. What did though was changing the .wslconfig setting memory from 2GB to 4GB, restarting the PC (Windows 10) and re running the docker build instruction.

Upvotes: 0

Oğuzcan Budumlu
Oğuzcan Budumlu

Reputation: 621

Adding export NODE_OPTIONS=--max_old_space_size=4096 to package.json solved the problem:

  "build": "export NODE_OPTIONS=--max_old_space_size=4096 && react-scripts build"

And remember you need to increase memory size from Docker settings.

Upvotes: 13

Anirudh Murali
Anirudh Murali

Reputation: 633

Node limits it's heap to 512M by default. Passing the environment variable in the RUN command worked for us.

RUN NODE_OPTIONS="--max-old-space-size=8192" yarn build

Upvotes: 3

mayorsanmayor
mayorsanmayor

Reputation: 2988

The NODE_OPTIONS solution did not work for me, I am using Node v14 and React Scripts v4.

This solution from GitHub finally helped - https://github.com/wojtekmaj/react-pdf/issues/496#issuecomment-566200248

GENERATE_SOURCEMAP=false

Added to my Dockerfile right before the build command.

enter image description here

Upvotes: 16

Oğuzcan Budumlu
Oğuzcan Budumlu

Reputation: 621

I could handle the issue on a Linux machine.

On Windows 10 machine, in the container, I run the following command:

export NODE_OPTIONS="--max-old-space-size=20000"

Then, I encountered the following error:

The build failed because the process exited too early. This probably means the system ran out of memory or someone called kill -9 on the process.

I have learned that the issue is swap space:

https://create-react-app.dev/docs/troubleshooting/#:~:text=The%20build%20failed%20because%20the,or%20build%20the%20project%20locally.

I could not increase the swap space of the container on Windows 10 machine but while the space size was 1 GB, it is 2 GB in the container on Linux machine.

Note that I encountered the error I have mentioned above in the first run of npm run build. After this attempt, I tried second run and it built successfully. I could do second run in Dockerfile with following commands:

...
RUN npm run build; exit 0
RUN npm run build
...

It is like a try-catch structure.

Upvotes: 4

Related Questions