CODEWITHSUNDEEP
javascriptnode.jsreactjswebpacknetlify
Tracer69
Tracer69

Reputation: 1110

React App crashes when running the production build

I can run my react-app (with the create-react-app boilerplate) perfectly fine with the local dev-server, but when I compile it using npm run build and then run it with a server (I tried netlify and local http-server), I do only get this error and the page does not load:

classCallCheck.js:1 Uncaught RangeError: Maximum call stack size exceeded
    at Object.a (classCallCheck.js:1)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)
    at e (Object.js:6)

The file Object.js is placed under src/Model/Objects/Object.js.

GitHub: https://github.com/Tracer1337/DynaSys
Deployed on Netlify: https://youthful-mestorf-9e0ba8.netlify.com/

What have I done wrong?

Upvotes: 1

Views: 4094

Answers (2)

Gabriel Jablonski
Gabriel Jablonski

Reputation: 943

Leaving this here for future reference. My React app was crashing on only one specific screen on the production build, but not in the dev environment.

Using adb logcat *:E I managed to track it down to an erroneous import very likely caused by vscode's intellisense importing a function from the wrong place.

Instead of doing import { useState } from "react", I was importing the useState() function from "react/cjs/react.development". Interestingly enough, the useState() from the wrong file actually worked just fine in the development build (the name of the file might be a hint as to the reason why).

Upvotes: 4

omnidan
omnidan

Reputation: 1182

That was an interesting one to debug. It seems like you have created a class called Object, which is a protected word in JavaScript.

You can figure out what is causing the issue by clicking on the source on the right hand side of the error. This will open the corresponding file that is causing the error (create-react-app provides source maps by default, so debugging even in production is not an issue).

I solved the issue by renaming the Object class to InternalObject, now everything runs fine even in production mode!

As to why it does work in development mode with that protected name, I have no clue though. Maybe someone else has an idea?

Upvotes: 5

Related Questions